/*
Theme Name: VIERAHAIR
Theme URI: https://example.com/luxehair
Author: VIERAHAIR Studio
Author URI: https://example.com/
Description: A professional, luxury WordPress theme for VIERAHAIR Vietnamese raw hair extensions. Two theme colours (primary + dark) chosen in the Customizer, centred square logo, WooCommerce-ready, with auto-created Home, About, Shop, Cart, Contact and Feedback pages on activation. Original code, no page-builder required.
Version: 1.3.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: luxehair
Tags: e-commerce, black, brown, luxury, custom-menu, custom-logo, featured-images, threaded-comments, translation-ready
*/

/* ============ VIERAHAIR — Local Typography ============ */
@font-face{
  font-family:'SVN-Gilroy';
  src:url('Fonts/SVN-Gilroy%20Medium.otf') format('opentype');
  font-weight:400 600;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'Montserrat';
  src:url('Fonts/Montserrat-Medium.ttf') format('truetype');
  font-weight:400 500;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'Montserrat';
  src:url('Fonts/Montserrat-Bold.ttf') format('truetype');
  font-weight:600 800;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'UTM Avo';
  src:url('Fonts/UTM%20Avo.ttf') format('truetype');
  font-weight:400 700;
  font-style:normal;
  font-display:swap;
}

/* ============ VIERAHAIR — Luxury Design Tokens ============ */
:root{
  --brand:#6B3A1E; --black:#111111; --ink:#111111; --white:#ffffff; --ivory:#f7f5f2;
  --cream:#efeae4; --grey:#6d6d6d; --line:#e4e0da; --soft:#9a9a9a;
  --serif:"SVN-Gilroy","Montserrat","Playfair Display",sans-serif;
  --sans:"Montserrat","SVN-Gilroy","Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --wrap:1240px;
  --header-height:86px;
  --header-height-mobile:64px;
  --header-height-scrolled:70px;
  --header-logo-h:72px;
  --header-logo-h-mobile:44px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--sans);font-size:16.5px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:clip;width:100%}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:4px}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.15;margin:0 0 .6em}
h1{font-size:clamp(2.4rem,5vw,4.2rem);letter-spacing:-.01em}
h2{font-size:clamp(1.9rem,3.6vw,3rem)}
h3{font-size:1.45rem}
p{margin:0 0 1.1em}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 24px}
.eyebrow{font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--grey);font-weight:500}
.eyebrow.light{color:#cfcfcf}
.rule{width:56px;height:1px;background:var(--black);margin:18px 0}
.rule.center{margin-left:auto!important;margin-right:auto!important;margin-top:16px;margin-bottom:20px}
.btn{display:inline-block;border:1px solid var(--brand);background:var(--brand);color:#fff;padding:15px 32px;font-size:13px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;cursor:pointer;transition:.25s}
.btn:hover{background:transparent;color:var(--brand);text-decoration:none}
.btn.white{background:#fff;color:var(--black);border-color:#fff}
.btn.white:hover{background:transparent;color:#fff}
.btn.outline{background:transparent;color:var(--black)}
.btn.outline:hover{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.small{padding:11px 22px;font-size:12px}
.section{padding:88px 0}
.section.ivory{background:var(--ivory)}
.section.black{background:var(--black);color:#fff}
.lead{font-size:1.15rem;color:#444;max-width:640px}
.section.black .lead{color:#c9c9c9}

/* Center Alignment Utilities */
.center{text-align:center!important}
.center>*{margin-left:auto!important;margin-right:auto!important}
.center .eyebrow,.center h1,.center h2,.center h3,.center h4,.center p,.center .lead{text-align:center!important;margin-left:auto!important;margin-right:auto!important}
.center .rule{margin-left:auto!important;margin-right:auto!important;margin-top:16px;margin-bottom:20px}
.section.center{text-align:center!important}
.section.center .wrap{text-align:center!important}
.section.center h1,.section.center h2,.section.center h3,.section.center h4,.section.center .eyebrow,.section.center .lead,.section.center .rule{text-align:center!important;margin-left:auto!important;margin-right:auto!important}
p.center{text-align:center!important;display:block;margin-left:auto!important;margin-right:auto!important}
p.center .btn{margin:0 auto}

/* Announcement + header — centred square logo, compact height */
.announce{background:var(--brand);color:#fff;text-align:center;font-size:12px;letter-spacing:.16em;text-transform:uppercase;padding:8px 16px}
.site-header{position:sticky;top:0;z-index:50;display:block !important;background:rgba(255,255,255,.97);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);width:100%}
.header-in{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;min-height:var(--header-height, 86px);height:auto;padding:8px 0;transition:min-height .25s ease, padding .25s ease}
.site-header.header-left .header-in{display:grid;grid-template-columns:auto 1fr auto;gap:32px;align-items:center;min-height:var(--header-height, 86px);height:auto;padding:8px 0;transition:min-height .25s ease, padding .25s ease}
.header-left{display:flex;align-items:center;justify-content:flex-start}
.header-logo-center{display:flex;align-items:center;justify-content:center;text-align:center;line-height:1}
.header-right{display:flex;align-items:center;justify-content:flex-end;gap:16px}
.logo{font-family:var(--serif);font-size:30px;letter-spacing:.14em;line-height:1;display:inline-block}
.logo small{display:block;font-family:var(--sans);font-size:10px;letter-spacing:.36em;color:var(--grey);margin-top:4px}
.logo:hover{text-decoration:none}
/* Logo: prominent luxury sizing, never cropped, dynamically adapts to header height */
.custom-logo-link{display:inline-block;line-height:0}
.custom-logo{max-height:var(--header-logo-h, 72px) !important;width:auto !important;height:auto !important;max-width:280px;object-fit:contain;display:inline-block;transition:max-height .25s ease}
.main-nav > ul{display:flex;gap:6px;list-style:none;margin:0;padding:0;align-items:center}
.main-nav a{font-size:14.5px;letter-spacing:.05em;text-transform:uppercase;font-weight:500;white-space:nowrap;color:var(--ink);transition:all .2s ease}
.main-nav a:hover{text-decoration:none;color:var(--brand)}
.main-nav .current-menu-item > a{color:var(--brand);font-weight:600}
.hotline{font-size:13px;letter-spacing:.04em;white-space:nowrap}
.hotline b{letter-spacing:.08em}
.hotline a:hover{color:var(--brand);text-decoration:none}
.cart-link{position:relative;font-size:13px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.cart-count{background:var(--brand);color:#fff;border-radius:50%;display:inline-flex;width:22px;height:22px;align-items:center;justify-content:center;font-size:11px;margin-left:4px}
.menu-toggle{display:none;background:none;border:1px solid var(--black);padding:9px 13px;font-size:12px;letter-spacing:.15em;text-transform:uppercase;cursor:pointer}
@media(max-width:900px){
  .header-in,
  .site-header.header-left .header-in,
  .site-header.header-center .header-in{
    display:flex !important;
    justify-content:space-between !important;
    align-items:center !important;
    min-height:64px;
    height:auto;
    padding:8px 16px !important;
    box-sizing:border-box !important;
    width:100% !important;
  }
  .header-logo-left,
  .header-logo-center{
    display:flex !important;
    align-items:center !important;
    flex:0 1 auto !important;
    min-width:0 !important;
  }
  .header-right{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:10px !important;
    flex:0 0 auto !important;
  }
  .main-nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--line);padding:20px 24px;z-index:60}
  .main-nav.open{display:block}
  .main-nav > ul{flex-direction:column;gap:16px}
  .menu-toggle{display:inline-flex !important;align-items:center;justify-content:center}
  .hotline{display:none}
  .custom-logo{max-height:56px !important;max-width:200px;width:auto !important;height:auto !important}
}

/* Google Map embed (contact page) */
.map-wrap{margin-top:48px;border:1px solid var(--line)}
.map-wrap iframe{display:block;width:100%;height:420px;border:0}
@media(max-width:560px){.map-wrap iframe{height:300px}}
/* Hero */
.hero{background:var(--black);color:#fff;padding:96px 0 88px;position:relative;overflow:hidden}
.hero:after{content:"VIERA";position:absolute;right:-20px;bottom:-40px;font-family:var(--serif);font-size:clamp(9rem,22vw,20rem);color:rgba(255,255,255,.05);line-height:1;pointer-events:none}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center;position:relative;z-index:1}
.hero h1{margin:.35em 0 .4em}
.hero p{color:#c9c9c9;max-width:520px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.hero-card{background:#171717;border:1px solid #2a2a2a;padding:32px}
.hero-card h3{color:#fff;font-size:1.3rem}
.hero-card p{color:#bdbdbd;font-size:.98rem}
.hero-stats{display:flex;gap:32px;margin-top:28px;border-top:1px solid #2a2a2a;padding-top:24px}
.hero-stats b{font-family:var(--serif);font-size:1.7rem;font-weight:500;display:block}
.hero-stats span{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#9a9a9a}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}}

/* Marquee */
.marquee{border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;padding:16px 0;white-space:nowrap}
.marquee span{font-family:var(--serif);font-size:1.15rem;letter-spacing:.08em;margin-right:44px}
.marquee span i{font-style:normal;color:var(--soft);margin-right:44px}

/* Grids */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
@media(max-width:900px){.grid-3,.grid-4{grid-template-columns:1fr 1fr}.grid-2{grid-template-columns:1fr}}
@media(max-width:560px){.grid-3{grid-template-columns:1fr}.grid-4{grid-template-columns:1fr 1fr;gap:12px}}
.card{border:1px solid var(--line);background:#fff;transition:.25s;display:flex;flex-direction:column}
.card:hover{border-color:var(--black);box-shadow:0 8px 24px rgba(0,0,0,.06)}
.card-img{aspect-ratio:4/5;background:var(--ivory);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.card-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,0,0,1);display:block}
.card:hover .card-img img{transform:scale(1.05)}
.card-img .mono{font-family:var(--serif);font-size:5rem;color:#d8d2ca;line-height:1}
.card-img .badge{position:absolute;top:14px;left:14px;background:var(--brand);color:#fff;font-size:11px;letter-spacing:.16em;text-transform:uppercase;padding:6px 10px}
.card-body{padding:22px 22px 26px;text-align:inherit}
.card-body h3{font-size:1.15rem;margin-bottom:.4em}
.card-body h3 a:hover{text-decoration:none}
.card-type{text-align:center}
.card-type .card-body{text-align:center}
.card-cta{display:inline-block;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--brand);margin-top:12px;border-bottom:1px solid var(--brand);padding-bottom:2px;transition:.2s}
.card:hover .card-cta{color:var(--black);border-color:var(--black)}
.meta{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--grey)}
.price{font-family:var(--serif);font-size:1.25rem;margin-top:8px}
.price del{color:var(--soft);font-size:1rem;margin-right:8px}
.stars{color:var(--brand);letter-spacing:2px;font-size:14px}
.feature{text-align:center;padding:8px}
.feature .num{font-family:var(--serif);font-size:2.2rem}
.feature h3{font-size:1.1rem;letter-spacing:.06em;text-transform:uppercase;font-family:var(--sans);font-weight:500}
.feature p{color:#555;font-size:.98rem}

/* Split / quote */
.split-img{background:var(--black);color:#fff;min-height:420px;display:flex;align-items:center;justify-content:center;text-align:center;padding:48px}
.split-img .big{font-family:var(--serif);font-size:clamp(2rem,4vw,3.2rem);line-height:1.2}
.quote{font-family:var(--serif);font-size:clamp(1.4rem,2.6vw,2.1rem);line-height:1.45}
.quote cite{display:block;font-family:var(--sans);font-style:normal;font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--grey);margin-top:18px}

/* ============ VIERAHAIR — Modern Luxury Feedback & Testimonials (Balanced Equal Heights) ============ */
.t-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  align-items: stretch;
}
@media(max-width:960px){
  .t-grid{grid-template-columns:1fr;gap:22px}
}
.t-card{
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  border-radius: 20px;
  padding: 32px 28px 24px;
  background: #ffffff;
  border: 1px solid #e8e2d8;
  box-shadow: 0 10px 30px rgba(107, 58, 30, 0.05);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease;
  overflow: hidden;
  box-sizing: border-box;
}
.t-card:hover{
  transform: translateY(-5px);
  box-shadow: 0 18px 42px rgba(107, 58, 30, 0.12);
  border-color: var(--brand);
}
.t-watermark-quote{
  position: absolute;
  top: 18px;
  right: 22px;
  color: var(--brand);
  opacity: 0.07;
  pointer-events: none;
  line-height: 1;
  transition: opacity 0.3s ease, transform 0.3s ease;
  z-index: 1;
}
.t-card:hover .t-watermark-quote{
  opacity: 0.15;
  transform: scale(1.08);
}
.t-card-header{
  display: flex;
  align-items: center;
  gap: 14px;
  position: relative;
  z-index: 2;
  margin-bottom: 6px;
}
.t-avatar-wrap{
  flex-shrink: 0;
  position: relative;
}
.t-avatar{
  width: 52px;
  height: 52px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #ffffff;
  box-shadow: 0 0 0 2px var(--brand);
  display: block;
}
.t-avatar-initial{
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #fbf8f5;
  color: var(--brand);
  border: 2px solid #ffffff;
  box-shadow: 0 0 0 2px var(--brand);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--serif);
  font-size: 1.35rem;
  font-weight: 700;
  flex-shrink: 0;
}
.t-author-meta{
  flex: 1;
  min-width: 0;
}
.t-author-name{
  font-family: var(--serif);
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.25;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.t-author-name b{
  font-weight: 600;
}
.t-verified{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .03em;
  color: #1e7025;
  background: #ebf6eb;
  padding: 2px 8px;
  border-radius: 12px;
  border: 1px solid rgba(46,125,50,0.18);
  line-height: 1.4;
}
.t-verified svg{
  display: inline-block;
  vertical-align: middle;
}
.t-role{
  font-family: var(--sans);
  font-size: 12px;
  color: #767069;
  letter-spacing: .05em;
  text-transform: uppercase;
  margin-top: 4px;
  font-weight: 500;
}
.t-rating-wrap{
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}
.luxehair-stars{
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.luxehair-stars svg{
  width: 15px;
  height: 15px;
  display: inline-block;
  vertical-align: middle;
}
.t-quote-wrap{
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin: 18px 0 20px;
  position: relative;
  z-index: 2;
}
.t-quote{
  margin: 0;
  font-family: var(--sans);
  font-size: 15.5px;
  line-height: 1.68;
  color: #38332f;
  font-style: normal;
}
.t-card-footer{
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid #f0ede8;
  position: relative;
  z-index: 2;
  min-height: 56px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  box-sizing: border-box;
}
.t-proof-strip{
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 12px;
}
.t-media-thumbs{
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: nowrap;
}
.t-media-thumb{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 8px;
  border: 1px solid #e5dfd7;
  background: #faf8f5;
  overflow: hidden;
  position: relative;
  cursor: pointer;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
  padding: 0;
  margin: 0;
  text-decoration: none;
  flex-shrink: 0;
}
.t-media-thumb:hover{
  transform: translateY(-2px) scale(1.06);
  border-color: var(--brand);
  box-shadow: 0 6px 16px rgba(0,0,0,0.12);
}
.t-media-thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.t-video-trigger .t-play-pill{
  position: absolute;
  inset: 0;
  margin: auto;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(107, 58, 30, 0.92);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  transition: transform 0.2s ease, background 0.2s ease;
}
.t-video-trigger:hover .t-play-pill{
  transform: scale(1.15);
  background: var(--brand);
}
.t-proof-label{
  margin-left: auto;
  font-family: var(--sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--brand);
  display: inline-flex;
  align-items: center;
  gap: 5px;
  text-transform: uppercase;
  flex-shrink: 0;
  white-space: nowrap;
}
.t-proof-seal{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--sans);
  font-size: 12px;
  font-weight: 500;
  color: #767069;
  width: 100%;
}
.t-proof-seal svg{
  color: var(--brand);
  flex-shrink: 0;
}

/* Feedback Cards on Dark Surfaces (e.g. Homepage Client Love) */
.section.black .t-card{
  background: #181514;
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.45);
}
.section.black .t-card:hover{
  border-color: #d1a868;
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.65), 0 0 24px rgba(209, 168, 104, 0.15);
}
.section.black .t-author-name{
  color: #ffffff;
}
.section.black .t-role{
  color: #a49e97;
}
.section.black .t-quote{
  color: #e5e0db;
}
.section.black .t-card-footer{
  border-top-color: rgba(255, 255, 255, 0.1);
}
.section.black .t-watermark-quote{
  color: #d1a868;
  opacity: 0.12;
}
.section.black .t-proof-seal{
  color: #b0aaa3;
}
.section.black .t-proof-seal svg{
  color: #d1a868;
}
.section.black .t-media-thumb{
  background: #25211e;
  border-color: rgba(255, 255, 255, 0.15);
}
.section.black .t-proof-label{
  color: #d1a868;
}

/* Global Media & Video Lightbox Modal */
.global-media-modal{
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.3s;
}
.global-media-modal.active{
  opacity: 1;
  visibility: visible;
}
.global-media-modal-backdrop{
  position: absolute;
  inset: 0;
  background: rgba(10, 8, 7, 0.88);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.global-media-modal-box{
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 860px;
  background: #110e0c;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 16px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.6);
  padding: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  animation: modalPop 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes modalPop{
  from{transform: scale(0.94) translateY(12px); opacity: 0;}
  to{transform: scale(1) translateY(0); opacity: 1;}
}
.global-media-modal-close{
  position: absolute;
  top: 14px;
  right: 14px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.2s ease;
  z-index: 10;
}
.global-media-modal-close:hover{
  background: var(--brand);
  border-color: var(--brand);
  transform: rotate(90deg);
}
.global-media-modal-content{
  width: 100%;
  max-height: 72vh;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  overflow: hidden;
  background: #000000;
}
.global-media-modal-content img{
  max-width: 100%;
  max-height: 70vh;
  object-fit: contain;
  display: block;
}
.global-media-modal-content video{
  width: 100%;
  max-height: 70vh;
  display: block;
}
.global-media-modal-content iframe{
  width: 100%;
  aspect-ratio: 16/9;
  border: 0;
  display: block;
}
.global-media-modal .modal-caption{
  margin-top: 14px;
  font-family: var(--serif);
  font-size: 1.1rem;
  color: #e5e0db;
  text-align: center;
}

/* Forms */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-grid .full{grid-column:1/-1}
label{display:block;font-size:12px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:6px;font-weight:500}
input[type=text],input[type=email],input[type=tel],input[type=number],select,textarea{width:100%;border:1px solid var(--line);background:#fff;padding:14px 16px;font:inherit;font-size:16px;color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--brand);outline-offset:-2px;border-color:var(--brand)}
textarea{min-height:150px;resize:vertical}
.notice{border:1px solid var(--black);background:var(--ivory);padding:16px 20px;margin-bottom:24px}
.notice.error{border-color:#8b0000;background:#fdf2f2}
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

/* ============ VIERAHAIR — Modern Luxury WooCommerce Styling ============ */
/* Breadcrumb */
.woocommerce .woocommerce-breadcrumb,
.woocommerce-breadcrumb{
  text-align: center;
  font-family: var(--sans);
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--grey);
  margin-bottom: 20px;
}
.woocommerce-breadcrumb a{
  color: var(--grey);
  transition: .2s;
}
.woocommerce-breadcrumb a:hover{
  color: var(--brand);
  text-decoration: none;
}

/* Shop & Category Header (Strictly Centered) */
.woocommerce-products-header{
  text-align: center;
  margin-bottom: 32px;
}
.woocommerce-products-header__title.page-title{
  font-family: var(--serif);
  font-size: clamp(2.2rem, 4.4vw, 3.4rem);
  font-weight: 500;
  line-height: 1.2;
  margin: 0 auto 12px;
  text-align: center;
  color: var(--ink);
}
.woocommerce-products-header .term-description{
  max-width: 780px;
  margin: 0 auto 28px;
  text-align: center;
  font-family: var(--sans);
  font-size: 1.05rem;
  line-height: 1.7;
  color: #444;
}

/* Hide legacy fallback sidebar */
#sidebar,
.widget-area{
  display: none !important;
}

/* Category Filter Chips (Shop & Category Archives) */
.cat-chips,
.cat-chips.shop-cat-chips{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 auto 36px;
  max-width: 1100px;
}
.cat-chips a,
.cat-chips.shop-cat-chips a{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 22px;
  border: 1.5px solid #dcd5cc;
  background: #ffffff;
  color: #222222;
  font-family: var(--sans);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  transition: all .22s cubic-bezier(0.16, 1, 0.3, 1);
  text-decoration: none;
  border-radius: var(--radius-sm, 8px) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
  line-height: 1.2;
}
.cat-chips a:hover,
.cat-chips.shop-cat-chips a:hover{
  border-color: var(--brand);
  color: var(--brand);
  background: #FAF7F2;
  text-decoration: none;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(107, 58, 30, 0.12);
}
.cat-chips a.active,
.cat-chips.shop-cat-chips a.active{
  background: var(--brand) !important;
  border-color: var(--brand) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(107, 58, 30, 0.26) !important;
}

/* Shop Result count and Ordering Toolbar */
.woocommerce .woocommerce-result-count{
  float: left;
  margin: 0;
  font-size: 13.5px;
  color: var(--grey);
  line-height: 44px;
}
.woocommerce .woocommerce-ordering{
  float: right;
  margin: 0 0 28px;
}
.woocommerce .woocommerce-ordering select.orderby{
  min-height: 44px;
  height: 44px;
  padding: 0 36px 0 16px;
  border: 1.5px solid #dcd5cc;
  background: #ffffff;
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 500;
  color: var(--ink);
  border-radius: var(--radius-sm, 8px) !important;
  cursor: pointer;
  outline: none;
  transition: all .2s;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}
.woocommerce .woocommerce-ordering select.orderby:focus{
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(107, 58, 30, 0.12);
}
@media(max-width:768px){
  .woocommerce .woocommerce-result-count,
  .woocommerce .woocommerce-ordering{
    float: none;
    text-align: center;
    margin: 0 auto 16px;
    width: 100%;
  }
  .woocommerce .woocommerce-ordering select.orderby{
    width: 100%;
    max-width: 320px;
  }
}

/* Products Grid */
.woocommerce ul.products{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  list-style: none;
  padding: 0;
  margin: 0 0 48px;
  clear: both;
}
.woocommerce ul.products:before,
.woocommerce ul.products:after{
  content: none;
}
.woocommerce ul.products li.product{
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
  text-align: center !important;
  background: #ffffff;
  border: 1px solid #e8e5df;
  border-radius: 8px;
  padding: 0 0 18px !important;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  position: relative;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.woocommerce ul.products li.product:hover{
  transform: translateY(-4px);
  border-color: var(--brand);
  box-shadow: 0 14px 32px rgba(107, 58, 30, 0.12);
}
.woocommerce ul.products li.product .woocommerce-LoopProduct-link{
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  text-decoration: none;
  padding: 0;
  margin: 0;
}
.woocommerce ul.products li.product img{
  width: 100% !important;
  aspect-ratio: 1/1;
  object-fit: cover !important;
  margin: 0 0 14px !important;
  background: #f7f5f2;
  display: block !important;
  border-radius: 0 !important;
  transition: transform .5s cubic-bezier(.16,1,.3,1);
}
.woocommerce ul.products li.product:hover img{
  transform: scale(1.05);
}

/* Modern Luxury Sale Badge */
.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale,
span.onsale{
  position: absolute !important;
  top: 12px !important;
  left: 12px !important;
  right: auto !important;
  margin: 0 !important;
  min-height: auto !important;
  min-width: auto !important;
  line-height: 1 !important;
  background: var(--brand) !important;
  color: #ffffff !important;
  font-family: var(--sans) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  padding: 6px 10px !important;
  border-radius: var(--radius-xs, 4px) !important;
  box-shadow: 0 2px 8px rgba(107,58,30,.25) !important;
  z-index: 2;
}

/* Loop Product Title */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family: var(--serif);
  font-size: 1.15rem;
  font-weight: 500;
  line-height: 1.35;
  margin: 0 auto 8px;
  text-align: center;
  color: var(--ink);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.7em;
}
.woocommerce ul.products li.product .price{
  color: var(--ink);
  font-family: var(--serif);
  font-size: 1.25rem;
  text-align: center;
  display: block;
  margin: 0 auto 16px;
}
.woocommerce ul.products li.product .price del{
  color: var(--soft);
  font-size: .95rem;
  margin-right: 6px;
}
.woocommerce ul.products li.product .price ins{
  text-decoration: none;
  font-weight: 600;
  color: var(--brand);
}

/* Add to Cart Button */
.woocommerce ul.products li.product .button{
  background: var(--ink);
  color: #ffffff;
  border: 1px solid var(--ink);
  border-radius: var(--radius-sm, 8px) !important;
  padding: 12px 22px;
  min-height: 42px;
  font-size: 11.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 600;
  margin: auto auto 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all .25s ease;
  width: auto;
}
.woocommerce ul.products li.product .button:hover{
  background: var(--brand);
  border-color: var(--brand);
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(107, 58, 30, 0.22);
}

/* Numbered Pagination */
.woocommerce nav.woocommerce-pagination{
  text-align: center;
  margin-top: 48px;
}
.woocommerce nav.woocommerce-pagination ul{
  display: inline-flex;
  justify-content: center;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0;
  border: 0;
}
.woocommerce nav.woocommerce-pagination ul li{
  border: 0;
  float: none;
  margin: 0;
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 44px;
  padding: 0 16px;
  border: 1.5px solid #dcd5cc;
  background: #ffffff;
  color: var(--ink);
  font-family: var(--sans);
  font-size: 13.5px;
  font-weight: 600;
  transition: all .2s ease;
  text-decoration: none;
  border-radius: var(--radius-sm, 8px) !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.03);
}
.woocommerce nav.woocommerce-pagination ul li a:hover{
  border-color: var(--brand);
  color: var(--brand);
  background: #FAF7F2;
  transform: translateY(-1px);
}
.woocommerce nav.woocommerce-pagination ul li span.current{
  background: var(--brand) !important;
  border-color: var(--brand) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(107, 58, 30, 0.26) !important;
}

/* ============ VIERAHAIR — Single Product Page ============ */
.woocommerce div.product{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
}
@media(max-width:860px){
  .woocommerce div.product{
    display: block;
  }
}

/* Force Product Gallery Visibility */
.woocommerce div.product div.images{
  opacity: 1 !important;
  visibility: visible !important;
  float: none !important;
  width: 100% !important;
  margin: 0 0 32px !important;
}
.woocommerce-product-gallery{
  opacity: 1 !important;
  background: #ffffff;
  border: 1px solid var(--line);
  padding: 10px;
  border-radius: var(--radius-md, 12px) !important;
}
.woocommerce-product-gallery .woocommerce-product-gallery__wrapper{
  margin: 0;
}
.woocommerce-product-gallery img{
  border-radius: var(--radius-sm, 8px) !important;
  display: block;
  width: 100%;
  height: auto;
}
.woocommerce div.product div.images .flex-control-thumbs{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-top: 12px;
  padding: 0;
  list-style: none;
}
.woocommerce div.product div.images .flex-control-thumbs li{
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm, 8px) !important;
  overflow: hidden;
  cursor: pointer;
}
.woocommerce div.product div.images .flex-control-thumbs li img{
  aspect-ratio: 1/1;
  object-fit: cover;
}

/* Product Summary */
.woocommerce div.product div.summary{
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
}
.woocommerce div.product .product_title{
  font-family: var(--serif);
  font-size: clamp(2rem, 3.4vw, 2.6rem);
  font-weight: 500;
  line-height: 1.25;
  margin: 0 0 12px;
  color: var(--ink);
}
.woocommerce div.product p.price{
  font-family: var(--serif);
  font-size: 1.7rem;
  color: var(--brand);
  margin: 0 0 20px;
}
.woocommerce div.product p.price ins{
  font-weight: 600;
  color: var(--brand);
  text-decoration: none;
}
.woocommerce div.product p.price del{
  color: var(--soft);
  font-size: 1.2rem;
  margin-right: 8px;
}
.woocommerce-product-details__short-description{
  margin: 0 0 24px;
  padding: 18px 22px;
  background: #faf8f5;
  border-left: 3px solid var(--brand);
  border-radius: var(--radius-sm, 8px) !important;
}
.woocommerce-product-details__short-description ul{
  margin: 0;
  padding-left: 18px;
}
.woocommerce-product-details__short-description li{
  margin-bottom: 6px;
  line-height: 1.6;
}

/* Add to cart form */
.woocommerce div.product form.cart{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin: 0 0 16px;
}
.woocommerce div.product form.cart .quantity{
  float: none;
  margin: 0;
}
.woocommerce div.product form.cart .quantity .qty{
  width: 72px;
  height: 48px;
  border: 1.5px solid #dcd5cc;
  background: #ffffff;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  color: var(--ink);
  border-radius: var(--radius-sm, 8px) !important;
}
.woocommerce div.product form.cart .button{
  height: 48px;
  flex: 1;
  min-width: 180px;
  background: var(--ink);
  color: #ffffff;
  border: 1px solid var(--ink);
  font-size: 12.5px;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-weight: 600;
  border-radius: var(--radius-sm, 8px) !important;
  transition: .25s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.woocommerce div.product form.cart .button:hover{
  background: var(--brand);
  border-color: var(--brand);
  color: #ffffff;
}

/* WhatsApp Wholesale CTA Button on Product */
.whatsapp-order-btn{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  width: 100% !important;
  height: 48px !important;
  background: #25D366 !important;
  border: 1px solid #25D366 !important;
  color: #ffffff !important;
  font-family: var(--sans) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  border-radius: var(--radius-sm, 8px) !important;
  margin: 8px 0 20px !important;
  transition: .25s ease !important;
  text-decoration: none !important;
}
.whatsapp-order-btn:hover{
  background: #1eb956 !important;
  border-color: #1eb956 !important;
  color: #ffffff !important;
  text-decoration: none !important;
}

/* Trust Badges */
.product-trust-badges{
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin: 24px 0;
  padding: 16px 20px;
  background: #faf8f5;
  border: 1px solid #eee8df;
  border-radius: var(--radius-md, 12px) !important;
}
.product-trust-badges .badge-item{
  display: flex;
  align-items: center;
  gap: 14px;
}
.product-trust-badges .badge-item svg{
  color: var(--brand);
  flex-shrink: 0;
}
.product-trust-badges .badge-item strong{
  display: block;
  font-size: 13.5px;
  color: var(--ink);
  line-height: 1.3;
}
.product-trust-badges .badge-item span{
  display: block;
  font-size: 12px;
  color: var(--grey);
  margin-top: 1px;
}

/* Product Meta (SKU, Categories, Tags) */
.woocommerce div.product .product_meta{
  font-size: 13px;
  color: var(--grey);
  border-top: 1px solid var(--line);
  padding-top: 18px;
  margin-top: 20px;
  line-height: 1.8;
}
.woocommerce div.product .product_meta a{
  color: var(--ink);
  font-weight: 500;
}
.woocommerce div.product .product_meta a:hover{
  color: var(--brand);
  text-decoration: none;
}

/* Product Tabs */
.woocommerce div.product .woocommerce-tabs{
  grid-column: 1 / -1;
  margin-top: 48px;
  border-top: 1px solid var(--line);
  padding-top: 36px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs{
  display: flex;
  justify-content: center;
  gap: 32px;
  list-style: none;
  padding: 0;
  margin: 0 0 28px;
  border-bottom: 2px solid var(--line);
}
.woocommerce div.product .woocommerce-tabs ul.tabs:before,
.woocommerce div.product .woocommerce-tabs ul.tabs:after{
  content: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li{
  border: 0;
  background: none;
  border-radius: 0;
  margin: 0;
  padding: 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  display: inline-block;
  padding: 12px 6px;
  font-family: var(--serif);
  font-size: 1.2rem;
  font-weight: 500;
  color: var(--grey);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  transition: .2s;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover{
  color: var(--ink);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{
  color: var(--ink);
  border-bottom-color: var(--brand);
}
.woocommerce div.product .woocommerce-tabs .panel{
  max-width: 860px;
  margin: 0 auto;
  line-height: 1.75;
  font-size: 15.5px;
}

/* Related Products */
.woocommerce .related.products,
.woocommerce .upsells.products{
  grid-column: 1 / -1;
  margin-top: 64px;
  padding-top: 48px;
  border-top: 1px solid var(--line);
}
.woocommerce .related.products > h2,
.woocommerce .upsells.products > h2{
  text-align: center;
  font-family: var(--serif);
  font-size: clamp(1.8rem, 3vw, 2.4rem);
  font-weight: 500;
  margin-bottom: 32px;
}

/* ============ VIERAHAIR — Luxury Star Rating ============ */
.woocommerce .star-rating,
.star-rating {
  overflow: hidden;
  position: relative;
  height: 1.25em;
  line-height: 1.25em;
  font-size: 0.9rem;
  width: 5.4em;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  display: inline-block;
  margin: 6px 0;
  vertical-align: middle;
  letter-spacing: 0.14em;
}
.woocommerce .star-rating::before,
.star-rating::before {
  content: "\2605\2605\2605\2605\2605";
  color: #D6CEC5;
  float: left;
  top: 0;
  left: 0;
  position: absolute;
  letter-spacing: 0.14em;
  line-height: 1.25em;
}
.woocommerce .star-rating span,
.star-rating span {
  overflow: hidden;
  float: left;
  top: 0;
  left: 0;
  position: absolute;
  padding-top: 1.5em;
  height: 0;
}
.woocommerce .star-rating span::before,
.star-rating span::before {
  content: "\2605\2605\2605\2605\2605";
  top: 0;
  position: absolute;
  left: 0;
  color: #D4AF37; /* Luxury 24k Gold */
  letter-spacing: 0.14em;
  line-height: 1.25em;
}
.woocommerce .star-rating strong,
.star-rating strong {
  display: none !important;
}
.woocommerce ul.products li.product .star-rating,
.card-product .star-rating,
.product .star-rating {
  margin: 8px auto 6px;
  display: block;
}

/* ============ VIERAHAIR — Luxury Cart Page Styling ============ */
.woocommerce-cart-form{
  margin-bottom: 0;
}
.woocommerce table.shop_table.cart{
  width: 100%;
  border: 1px solid var(--line);
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 8px;
  background: #ffffff;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0,0,0,0.03);
}
.woocommerce table.shop_table.cart th{
  background: #FAF8F5;
  color: var(--ink);
  font-family: var(--sans);
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 700;
  padding: 16px 20px;
  border-bottom: 1px solid var(--line);
  border-top: none;
  text-align: left;
}
.woocommerce table.shop_table.cart td{
  padding: 18px 20px;
  border-bottom: 1px solid var(--line);
  border-top: none;
  vertical-align: middle;
  font-size: 15px;
}
.woocommerce table.shop_table.cart tr:last-child td{
  border-bottom: none;
}
.woocommerce table.shop_table.cart td.product-remove{
  width: 44px;
  text-align: center;
  padding-right: 8px;
}
.woocommerce table.shop_table.cart td.product-remove a.remove{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #F4EFEA;
  color: #7A7269 !important;
  font-size: 18px;
  line-height: 1;
  text-decoration: none;
  transition: all .2s ease;
}
.woocommerce table.shop_table.cart td.product-remove a.remove:hover{
  background: #A62828;
  color: #ffffff !important;
  transform: rotate(90deg);
}
.woocommerce table.shop_table.cart td.product-thumbnail{
  width: 90px;
  padding-left: 0;
  padding-right: 16px;
}
.woocommerce table.shop_table.cart td.product-thumbnail img{
  width: 76px;
  height: 76px;
  object-fit: cover;
  border-radius: 6px;
  display: block;
  border: 1px solid #EAE5DE;
  background: #FAF8F5;
}
.woocommerce table.shop_table.cart td.product-name a{
  font-family: var(--serif);
  font-size: 1.12rem;
  font-weight: 600;
  color: var(--ink);
  display: block;
  line-height: 1.35;
  transition: color 0.2s ease;
}
.woocommerce table.shop_table.cart td.product-name a:hover{
  color: var(--brand);
  text-decoration: none;
}
.woocommerce table.shop_table.cart td.product-price,
.woocommerce table.shop_table.cart td.product-subtotal{
  font-family: var(--serif);
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--brand);
  white-space: nowrap;
}
.woocommerce table.shop_table.cart td.product-quantity .quantity input.qty{
  width: 60px;
  height: 40px;
  border: 1px solid #D5CFC7;
  border-radius: 4px;
  text-align: center;
  font-size: 15px;
  font-weight: 600;
  color: var(--ink);
  background: #FAF8F5;
  transition: border-color 0.2s ease;
}
.woocommerce table.shop_table.cart td.product-quantity .quantity input.qty:focus{
  border-color: var(--brand);
  background: #ffffff;
  outline: none;
}
.woocommerce table.shop_table.cart td.actions{
  padding: 18px 20px;
  background: #FAF8F5;
  border-top: 1px solid var(--line);
}
.woocommerce table.shop_table.cart td.actions .coupon{
  display: flex;
  gap: 10px;
  align-items: center;
  float: left;
}
.woocommerce table.shop_table.cart td.actions .coupon input.input-text{
  width: 190px;
  height: 42px;
  padding: 0 14px;
  border: 1px solid #D5CFC7;
  border-radius: 4px;
  font-size: 14px;
  background: #ffffff;
}
.woocommerce table.shop_table.cart td.actions .coupon input.input-text:focus{
  border-color: var(--brand);
  outline: none;
}
.woocommerce table.shop_table.cart td.actions .coupon button.button,
.woocommerce table.shop_table.cart td.actions button.button[name="update_cart"]{
  height: 42px;
  padding: 0 20px;
  background: #1C140E;
  color: #FFFFFF !important;
  border: 1px solid #1C140E;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  border-radius: 4px;
  cursor: pointer;
  transition: all .2s ease;
}
.woocommerce table.shop_table.cart td.actions button.button[name="update_cart"]{
  background: transparent;
  color: #1C140E !important;
  border: 1px solid #1C140E;
  float: right;
}
.woocommerce table.shop_table.cart td.actions button.button[name="update_cart"]:hover{
  background: #1C140E;
  color: #FFFFFF !important;
}
.woocommerce table.shop_table.cart td.actions .coupon button.button:hover{
  background: var(--brand);
  border-color: var(--brand);
  color: #FFFFFF !important;
}

/* Order Totals Card */
.woocommerce .cart-collaterals .cart_totals{
  width: 100%;
  max-width: 100%;
  background: #ffffff;
  border: 1px solid var(--line);
  padding: 28px 24px;
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0,0,0,.04);
}
.woocommerce .cart_totals h2{
  font-family: var(--serif);
  font-size: 1.45rem;
  font-weight: 600;
  color: var(--ink);
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--ink);
  letter-spacing: 0.02em;
}
.woocommerce .cart_totals table.shop_table{
  border: none;
  background: transparent;
  margin-bottom: 16px;
  width: 100%;
}
.woocommerce .cart_totals table.shop_table th{
  background: transparent;
  padding: 12px 0;
  border-bottom: 1px solid #eee7df;
  font-size: 13.5px;
  font-weight: 600;
  color: #666;
  width: 40%;
}
.woocommerce .cart_totals table.shop_table td{
  background: transparent;
  padding: 12px 0;
  border-bottom: 1px solid #eee7df;
  text-align: right;
  font-size: 14.5px;
  color: var(--ink);
}
.woocommerce .cart_totals table.shop_table tr.order-total th,
.woocommerce .cart_totals table.shop_table tr.order-total td{
  border-top: 2px solid var(--ink);
  border-bottom: none;
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--brand);
  padding-top: 16px;
}
.woocommerce .cart_totals .wc-proceed-to-checkout{
  padding: 0;
  margin-top: 8px;
}

/* Proceed to Checkout button - Ultra high priority override against WooCommerce core purple (#7f54b3) */
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce .wc-proceed-to-checkout a.checkout-button,
:where(body:not(.woocommerce-block-theme-has-button-styles)) a.checkout-button.button.alt,
.woocommerce .cart-collaterals .cart_totals .wc-proceed-to-checkout a.checkout-button,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button{
  display: block !important;
  width: 100% !important;
  height: 52px !important;
  line-height: 52px !important;
  padding: 0 20px !important;
  background: linear-gradient(135deg, #1C140E 0%, #2E1F16 100%) !important;
  background-color: #1C140E !important;
  color: #FFFFFF !important;
  font-family: var(--sans) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  border: 1px solid #1C140E !important;
  border-radius: 4px !important;
  box-shadow: 0 6px 18px rgba(28, 20, 14, 0.25) !important;
  transition: all 0.25s ease !important;
  margin-top: 16px !important;
  box-sizing: border-box !important;
}
:where(body:not(.woocommerce-block-theme-has-button-styles)) .woocommerce .wc-proceed-to-checkout a.checkout-button:hover,
:where(body:not(.woocommerce-block-theme-has-button-styles)) a.checkout-button.button.alt:hover,
.woocommerce .cart-collaterals .cart_totals .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover{
  background: var(--brand) !important;
  background-color: var(--brand) !important;
  border-color: var(--brand) !important;
  color: #FFFFFF !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 22px rgba(107, 58, 30, 0.35) !important;
}

/* Mobile Cart Table (Clean Card Layout) */
@media (max-width: 768px) {
  .woocommerce table.shop_table.cart{
    border: none !important;
    background: transparent !important;
    display: block !important;
    box-shadow: none !important;
  }
  .woocommerce table.shop_table.cart thead{
    display: none !important;
  }
  .woocommerce table.shop_table.cart tbody{
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    width: 100% !important;
  }
  .woocommerce table.shop_table.cart tr.woocommerce-cart-form__cart-item{
    display: grid !important;
    grid-template-columns: 74px 1fr 30px !important;
    grid-template-areas:
      "thumb name remove"
      "thumb price remove"
      "thumb qty subtotal" !important;
    gap: 6px 12px !important;
    align-items: center !important;
    background: #ffffff !important;
    border: 1px solid var(--line) !important;
    border-radius: 8px !important;
    padding: 14px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.03) !important;
    position: relative !important;
  }
  .woocommerce table.shop_table.cart td{
    padding: 0 !important;
    border: none !important;
    display: block !important;
    text-align: left !important;
    background: transparent !important;
  }
  .woocommerce table.shop_table.cart td::before{
    display: none !important; /* Eliminate default WooCommerce clunky data-title labels */
  }
  .woocommerce table.shop_table.cart td.product-thumbnail{
    grid-area: thumb !important;
    width: 74px !important;
    height: 74px !important;
    padding: 0 !important;
  }
  .woocommerce table.shop_table.cart td.product-thumbnail img{
    width: 74px !important;
    height: 74px !important;
    object-fit: cover !important;
    border-radius: 6px !important;
    border: 1px solid #EAE5DE !important;
  }
  .woocommerce table.shop_table.cart td.product-name{
    grid-area: name !important;
    padding-right: 4px !important;
  }
  .woocommerce table.shop_table.cart td.product-name a{
    font-size: 0.98rem !important;
    line-height: 1.3 !important;
    font-weight: 600 !important;
  }
  .woocommerce table.shop_table.cart td.product-price{
    grid-area: price !important;
    font-size: 0.92rem !important;
    color: #7A7269 !important;
    font-weight: 500 !important;
  }
  .woocommerce table.shop_table.cart td.product-quantity{
    grid-area: qty !important;
  }
  .woocommerce table.shop_table.cart td.product-quantity .quantity input.qty{
    width: 52px !important;
    height: 34px !important;
    font-size: 13.5px !important;
  }
  .woocommerce table.shop_table.cart td.product-subtotal{
    grid-area: subtotal !important;
    font-size: 1.05rem !important;
    font-weight: 700 !important;
    color: var(--brand) !important;
    text-align: right !important;
  }
  .woocommerce table.shop_table.cart td.product-remove{
    grid-area: remove !important;
    text-align: right !important;
    width: auto !important;
    padding: 0 !important;
  }
  .woocommerce table.shop_table.cart td.product-remove a.remove{
    width: 26px !important;
    height: 26px !important;
    font-size: 16px !important;
  }
  .woocommerce table.shop_table.cart tr td.actions{
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    background: #ffffff !important;
    border: 1px solid var(--line) !important;
    border-radius: 8px !important;
    padding: 14px !important;
  }
  .woocommerce table.shop_table.cart td.actions .coupon{
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 10px !important;
    float: none !important;
  }
  .woocommerce table.shop_table.cart td.actions .coupon input.input-text{
    width: 100% !important;
    height: 44px !important;
    font-size: 14px !important;
    padding: 0 14px !important;
    box-sizing: border-box !important;
  }
  .woocommerce table.shop_table.cart td.actions .coupon button.button{
    width: 100% !important;
    height: 44px !important;
    padding: 0 16px !important;
    text-align: center !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .08em !important;
    box-sizing: border-box !important;
  }
  .woocommerce table.shop_table.cart td.actions button.button[name="update_cart"]{
    width: 100% !important;
    height: 44px !important;
    float: none !important;
    box-sizing: border-box !important;
  }
}

/* Empty Cart State */
.woocommerce .cart-empty{
  text-align: center;
  padding: 60px 24px;
  background: #faf8f5;
  border: 1px solid var(--line);
  border-radius: 4px;
  font-size: 1.2rem;
  color: var(--ink);
  margin-bottom: 24px;
}
.woocommerce .return-to-shop{
  text-align: center;
  margin-top: 24px;
}
.woocommerce .return-to-shop .button{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 15px 36px;
  background: var(--brand);
  color: #fff !important;
  border: 1px solid var(--brand);
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  transition: all .2s ease;
  text-decoration: none;
  border-radius: 3px;
}
.woocommerce .return-to-shop .button:hover{
  background: var(--ink);
  border-color: var(--ink);
  color: #fff !important;
}

/* ============ VIERAHAIR — Checkout Page Styling ============ */
form.checkout.woocommerce-checkout{
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  grid-template-areas:
    "customer heading"
    "customer review";
  column-gap: 48px;
  row-gap: 0;
  align-items: start;
}
@media(max-width:960px){
  form.checkout.woocommerce-checkout{
    display: block;
  }
}
.woocommerce-checkout .woocommerce-NoticeGroup,
.woocommerce-checkout .woocommerce-form-coupon-toggle,
.woocommerce-checkout .woocommerce-form-login-toggle,
.woocommerce-checkout form.checkout_coupon{
  grid-column: 1 / -1;
  margin-bottom: 24px;
}
.woocommerce-checkout .woocommerce-info{
  background: #faf8f5;
  border: 1px solid var(--line);
  border-left: 3px solid var(--brand);
  padding: 14px 20px;
  font-size: 14.5px;
  margin-bottom: 20px;
}
.woocommerce-checkout .woocommerce-info a{
  color: var(--brand);
  font-weight: 600;
}
#customer_details{
  grid-area: customer;
  width: 100%;
}
#customer_details .col-1,
#customer_details .col-2{
  width: 100%;
  float: none;
  padding: 0;
  margin-bottom: 28px;
}
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
.woocommerce-additional-fields h3,
#order_review_heading{
  font-family: var(--serif);
  font-size: 1.45rem;
  font-weight: 600;
  margin: 0 0 18px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--ink);
}
#order_review_heading{
  grid-area: heading;
  margin-bottom: 16px;
}
.woocommerce-checkout .form-row{
  margin: 0 0 16px;
  padding: 0;
}
.woocommerce-checkout .form-row label{
  display: block;
  font-size: 13.5px;
  font-weight: 600;
  margin-bottom: 6px;
  color: #222;
}
.woocommerce-checkout .form-row .required{
  color: #c94a29;
  text-decoration: none;
}
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea{
  width: 100%;
  height: 48px;
  padding: 0 16px;
  border: 1px solid #d5cfc7;
  border-radius: 3px;
  font-family: var(--sans);
  font-size: 15px;
  color: var(--ink);
  background: #ffffff;
  transition: border-color .2s ease, box-shadow .2s ease;
  box-sizing: border-box;
}
.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout .form-row textarea:focus{
  outline: none;
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(107, 58, 30, 0.12);
}
.woocommerce-checkout .form-row textarea{
  height: 96px;
  padding: 12px 16px;
}
.woocommerce-checkout #order_review{
  grid-area: review;
  position: sticky;
  top: 96px;
  background: #ffffff;
  border: 1px solid var(--line);
  padding: 32px 28px;
  border-radius: 4px;
  box-shadow: 0 12px 36px rgba(0,0,0,.06);
}
.woocommerce-checkout-review-order-table{
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 24px;
}
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td{
  padding: 14px 0;
  border-bottom: 1px solid #eee8e0;
  font-size: 14.5px;
}
.woocommerce-checkout-review-order-table th{
  font-weight: 600;
  color: #666;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: .1em;
}
.woocommerce-checkout-review-order-table td.product-name{
  font-weight: 500;
}
.woocommerce-checkout-review-order-table td.product-total{
  text-align: right;
  font-family: var(--serif);
  font-weight: 600;
  color: var(--brand);
}
.woocommerce-checkout-review-order-table tr.order-total th,
.woocommerce-checkout-review-order-table tr.order-total td{
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--brand);
  border-top: 2px solid var(--ink);
  border-bottom: none;
  padding-top: 18px;
}
#order_review #payment{
  background: #faf8f5;
  border: 1px solid #ede8e1;
  border-radius: 4px;
  padding: 22px;
  margin-top: 24px;
}
#order_review #payment ul.payment_methods{
  list-style: none;
  padding: 0;
  margin: 0 0 16px;
  border-bottom: 1px solid #e4ded7;
}
#order_review #payment ul.payment_methods li{
  margin-bottom: 14px;
  font-size: 14.5px;
}
#order_review #payment ul.payment_methods li label{
  font-weight: 600;
  cursor: pointer;
  margin-left: 8px;
}
#order_review #payment .payment_box{
  background: #ffffff;
  border: 1px solid #ede8e1;
  padding: 14px 18px;
  font-size: 13.5px;
  line-height: 1.6;
  margin: 10px 0 14px;
  border-radius: 3px;
  color: #444;
}
#order_review #place_order{
  width: 100%;
  height: 54px;
  background: var(--brand);
  border: 1px solid var(--brand);
  color: #ffffff !important;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  border-radius: 3px;
  cursor: pointer;
  transition: all .25s ease;
  margin-top: 18px;
  box-shadow: 0 4px 14px rgba(107, 58, 30, 0.25);
}
#order_review #place_order:hover{
  background: var(--ink);
  border-color: var(--ink);
  color: #ffffff !important;
  box-shadow: 0 6px 20px rgba(0,0,0,.25);
}

/* Content pages */
.page-head{padding:64px 0 36px;border-bottom:1px solid var(--line);text-align:center}
.page-head .wrap{display:flex;flex-direction:column;align-items:center}
.page-head .eyebrow{margin:0 auto 10px}
.page-head h1{font-family:var(--serif);font-size:clamp(2.2rem,4.2vw,3.2rem);margin:0 auto .2em;text-align:center}
.page-head .lead{margin:8px auto 0;text-align:center;max-width:720px}
.entry{max-width:1100px;margin:0 auto}
.entry h2{margin-top:1.6em}
.entry ul{padding-left:20px}
.entry li{margin-bottom:.4em}
.woocommerce .cart-empty{text-align:center;border-top:3px solid var(--brand);background:#faf8f5;padding:24px;font-size:1.1rem;color:var(--ink);border-radius:2px}
.woocommerce .return-to-shop{text-align:center;margin-top:24px}
.woocommerce .return-to-shop .button{background:var(--ink);color:#fff;border:1px solid var(--ink);padding:13px 28px;letter-spacing:.14em;text-transform:uppercase;font-size:12px;font-weight:600;border-radius:2px;display:inline-block;transition:.25s}
.woocommerce .return-to-shop .button:hover{background:var(--brand);border-color:var(--brand);color:#fff}
.post-card{border-bottom:1px solid var(--line);padding:28px 0}
.post-card:first-child{padding-top:0}
.post-card h2{font-size:1.7rem}
.post-card h2 a:hover{text-decoration:none}
.pagination{display:flex;gap:10px;margin-top:36px;justify-content:center}
.pagination a,.pagination span{
  border:1.5px solid #dcd5cc;
  padding:0 16px;
  min-height:44px;
  min-width:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:600;
  font-size:13.5px;
  border-radius:var(--radius-sm, 8px) !important;
  background:#fff;
  color:var(--ink);
  transition:all .2s ease;
  text-decoration:none;
}
.pagination a:hover{
  border-color:var(--brand);
  color:var(--brand);
  background:#FAF7F2;
  transform:translateY(-1px);
}
.pagination .current{
  background:var(--brand) !important;
  color:#fff !important;
  border-color:var(--brand) !important;
  box-shadow:0 4px 14px rgba(107,58,30,.26);
}
.faq{border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-q{width:100%;background:none;border:0;text-align:left;font-family:var(--serif);font-size:1.25rem;padding:22px 0;cursor:pointer;display:flex;justify-content:space-between;gap:20px}
.faq-a{display:none;padding:0 0 24px;color:#444}
.faq-item.open .faq-a{display:block}
.faq-item.open .faq-q span:last-child{transform:rotate(45deg)}
.checklist{list-style:none;padding:0}
.checklist li{padding-left:28px;position:relative;margin-bottom:12px}
.checklist li:before{content:"—";position:absolute;left:0;color:var(--brand)}

/* ============ VIERAHAIR — Modern Luxury Footer & Trust Strip ============ */
.footer-trust-strip{
  background: #171717;
  border-top: 1px solid #282828;
  border-bottom: 1px solid #282828;
  padding: 32px 0;
  color: #fff;
}
.trust-strip-grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px;
}
@media(max-width:960px){
  .trust-strip-grid{
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}
@media(max-width:540px){
  .trust-strip-grid{
    grid-template-columns: 1fr;
    gap: 16px;
  }
}
.trust-strip-item{
  display: flex;
  align-items: flex-start;
  gap: 14px;
}
.trust-strip-icon{
  color: #D4AF37;
  font-size: 18px;
  line-height: 1;
  flex-shrink: 0;
  margin-top: 3px;
}
.trust-strip-item h4{
  font-family: var(--sans);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #ffffff;
  margin: 0 0 4px;
}
.trust-strip-item p{
  font-size: 13px;
  color: #9e9e9e;
  line-height: 1.45;
  margin: 0;
}

/* Site Footer */
.site-footer{
  background: #111111;
  color: #e5e5e5;
  position: relative;
  overflow: hidden;
}
.site-footer .wrap{
  position: relative;
  z-index: 2;
}
.footer-grid{
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.15fr 1.25fr;
  gap: 36px;
  padding: 72px 0 48px;
}
@media(max-width:1100px){
  .footer-grid{
    grid-template-columns: 1.4fr 1fr 1fr;
    row-gap: 40px;
  }
  .footer-col-contact, .footer-col-newsletter{
    grid-column: span 1.5;
  }
}
@media(max-width:768px){
  .footer-grid{
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 32px 16px;
    padding: 48px 0 32px;
  }
  .footer-col-brand{
    grid-column: span 12;
  }
  .footer-col-nav{
    grid-column: span 6;
  }
  .footer-col-contact{
    grid-column: span 12;
  }
  .footer-col-newsletter{
    grid-column: span 12;
  }
  .footer-news-form .news-input-wrap{
    max-width: 100%;
  }
  .footer-news-form input[type="email"]{
    min-width: 0;
  }
}

/* Creative Luxury Footer Logo */
.footer-logo-luxury{
  margin-bottom: 20px;
}
.footer-logo-anchor{
  display: flex;
  align-items: center;
  gap: 16px;
  text-decoration: none;
}
.footer-logo-anchor:hover{
  text-decoration: none;
}
.footer-logo-media{
  width: 64px;
  height: 64px;
  border-radius: 50%;
  padding: 3px;
  background: linear-gradient(135deg, #D4AF37 0%, #8C6239 50%, #D4AF37 100%);
  box-shadow: 0 0 16px rgba(212, 175, 55, 0.25);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.footer-logo-img{
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  background: #ffffff;
}
.footer-logo-typography{
  display: flex;
  flex-direction: column;
}
.footer-brand-title{
  font-family: var(--serif);
  font-size: 24px;
  font-weight: 600;
  letter-spacing: .12em;
  color: #ffffff;
  line-height: 1;
}
.footer-brand-subtitle{
  font-family: var(--sans);
  font-size: 9px;
  letter-spacing: .28em;
  color: #D4AF37;
  margin-top: 6px;
  text-transform: uppercase;
}
.footer-brand-desc{
  font-size: 14px;
  line-height: 1.6;
  color: #a8a8a8;
  margin-bottom: 22px;
}
.footer-social-strip{
  display: flex;
  gap: 12px;
  align-items: center;
}
.footer-social-strip a{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #1f1f1f;
  border: 1px solid #333333;
  color: #ffffff;
  transition: all .2s ease;
}
.footer-social-strip a:hover{
  background: var(--brand);
  border-color: var(--brand);
  transform: translateY(-2px);
  color: #ffffff;
  text-decoration: none;
}

/* Footer Navigation & Columns */
.site-footer h4{
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #ffffff;
  margin: 0 0 20px;
  position: relative;
  padding-bottom: 10px;
}
.site-footer h4:after{
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 28px;
  height: 2px;
  background: var(--brand);
}
.site-footer ul{
  list-style: none;
  padding: 0;
  margin: 0;
}
.site-footer li{
  margin-bottom: 11px;
}
.site-footer a{
  color: #b3b3b3;
  font-size: 14px;
  transition: color .2s ease, padding-left .2s ease;
  display: inline-block;
}
.site-footer a:hover{
  color: #ffffff;
  text-decoration: none;
  padding-left: 4px;
}

/* Contact Column */
.footer-contact-items{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.footer-contact-row{
  margin: 0;
  font-size: 13.5px;
  line-height: 1.5;
  color: #b3b3b3;
}
.footer-contact-label{
  display: block;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #D4AF37;
  font-weight: 600;
  margin-bottom: 2px;
}
.footer-contact-val{
  color: #e0e0e0;
}
.footer-contact-val strong{
  color: #25D366;
}

/* VIP Newsletter Column */
.footer-col-newsletter p{
  font-size: 13.5px;
  line-height: 1.55;
  color: #a8a8a8;
  margin-bottom: 18px;
}
.footer-news-form .news-input-wrap{
  display: flex;
  gap: 0;
  width: 100%;
}
.footer-news-form input[type="email"]{
  flex: 1;
  height: 44px;
  padding: 0 14px;
  background: #1c1c1c;
  border: 1px solid #333333;
  color: #ffffff;
  font-size: 13.5px;
  border-radius: var(--radius-sm, 8px) 0 0 var(--radius-sm, 8px);
  box-sizing: border-box;
}
.footer-news-form input[type="email"]:focus{
  outline: none;
  border-color: var(--brand);
}
.footer-news-form button{
  height: 44px;
  padding: 0 18px;
  background: var(--brand);
  border: 1px solid var(--brand);
  color: #ffffff;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  border-radius: 0 var(--radius-sm, 8px) var(--radius-sm, 8px) 0;
  cursor: pointer;
  transition: all .2s ease;
  white-space: nowrap;
}
.footer-news-form button:hover{
  background: #fff;
  border-color: #fff;
  color: #111;
}

/* Custom HTML in footer */
.footer-custom-html-wrap{
  border-top: 1px solid #222222;
  padding: 24px 0;
  margin-top: 24px;
}

/* Footer Bottom Bar */
.footer-bottom{
  border-top: 1px solid #242424;
  padding: 24px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  font-size: 13px;
  color: #8c8c8c;
}
.footer-bottom-badges{
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.badge-tag{
  display: inline-block;
  background: #1b1b1b;
  border: 1px solid #2e2e2e;
  padding: 4px 10px;
  border-radius: var(--radius-xs, 4px);
  font-size: 11px;
  color: #b0b0b0;
  letter-spacing: .04em;
}
.wp-caption{max-width:100%}
.aligncenter{margin-left:auto;margin-right:auto}
.screen-reader-text{position:absolute;left:-9999px}

/* ============ VIERAHAIR 1.2.0 — header layouts, WhatsApp, tabs, intro ============ */
@media(min-width:901px){
  /* Center-logo header: menu left | logo center | actions right */
  .site-header.header-center .header-in{display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:stretch}
  .site-header.header-center .header-left{display:flex;align-items:stretch;justify-content:flex-start;height:100%}

  /* Left-logo header: logo left | menu center | actions right */
  .site-header.header-left .header-in{display:grid;grid-template-columns:auto 1fr auto;gap:32px;align-items:stretch}
  .header-logo-left{display:flex;align-items:center;height:100%}
  .site-header.header-left .header-right{display:flex;align-items:center;justify-content:flex-end;gap:16px;height:100%}
}

/* WhatsApp icon button (Pure PNG, No background) + cart icon */
.whatsapp-btn{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  line-height: 0 !important;
  vertical-align: middle !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: transform .25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.whatsapp-btn:hover{
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  transform: scale(1.1) !important;
  text-decoration: none !important;
}
.whatsapp-btn span:not(.screen-reader-text){
  display: none !important;
}
.cart-link{display:inline-flex;align-items:center;position:relative;line-height:0}
.cart-link svg{width:27px;height:27px}
.cart-link .cart-count{position:absolute;top:-9px;right:-11px;margin-left:0}
/* ============ VIERAHAIR — Modern Section 2: Factory Video & Intro ============ */
.section-home-intro{
  padding: 60px 0 52px;
  background: #ffffff;
}
.intro-main-grid{
  display: grid;
  grid-template-columns: 1.12fr 1fr;
  gap: 48px;
  align-items: start;
}
.intro-col-left{
  display: flex;
  flex-direction: column;
}
.intro-col-left .intro-slider{
  position: relative;
}
.intro-col-left .intro-slides{
  min-height: 280px;
}
.intro-col-left .intro-slide .lead{
  font-size: 16px;
  line-height: 1.7;
  color: #38332f;
  margin-bottom: 16px;
}
.intro-col-left .intro-slide p:not(.lead){
  font-size: 15px;
  line-height: 1.68;
  color: #615a55;
}
.intro-cta-actions{
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 26px;
  flex-wrap: wrap;
}
.intro-cta-actions .btn{
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

/* Video Card Right Column (Full 100% Width & Free Natural Height) */
.intro-col-right{
  display: flex;
  flex-direction: column;
  width: 100%;
}
.intro-video-card{
  position: relative;
  width: 100%;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 16px 42px rgba(107, 58, 30, 0.12);
  border: 1px solid rgba(209, 168, 104, 0.25);
  line-height: 0;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease, border-color 0.3s ease;
}
.intro-video-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 24px 54px rgba(107, 58, 30, 0.2);
  border-color: rgba(209, 168, 104, 0.5);
}
.intro-banner-picture{
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  line-height: 0;
}
.intro-banner-media{
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: inherit;
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.intro-video-card:hover .intro-banner-media{
  transform: scale(1.03);
}
.intro-video-overlay{
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 36px 28px;
  background: linear-gradient(180deg, rgba(17, 14, 12, 0.22) 0%, rgba(17, 14, 12, 0.52) 48%, rgba(17, 14, 12, 0.88) 100%);
  border-radius: inherit;
  line-height: normal;
  gap: 16px;
  box-sizing: border-box;
  transition: background 0.35s ease;
}
.intro-video-card:hover .intro-video-overlay{
  background: linear-gradient(180deg, rgba(17, 14, 12, 0.16) 0%, rgba(17, 14, 12, 0.44) 48%, rgba(17, 14, 12, 0.82) 100%);
}
.intro-video-badge{
  font-family: var(--sans);
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: #d1a868;
  font-weight: 600;
  background: rgba(0, 0, 0, 0.48);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  padding: 5px 16px;
  border-radius: 20px;
  border: 1px solid rgba(209, 168, 104, 0.35);
  display: inline-block;
}
.intro-video-heading{
  font-family: var(--serif);
  font-size: clamp(1.8rem, 2.7vw, 2.35rem);
  font-weight: 500;
  line-height: 1.25;
  color: #ffffff;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.65);
  margin: 0;
}
.intro-video-play-btn{
  background: none;
  border: none;
  padding: 12px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  position: relative;
  margin-top: 6px;
  text-decoration: none;
  outline: none;
}
.play-btn-circle{
  position: relative;
  z-index: 2;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: linear-gradient(135deg, #d1a868 0%, #a8793b 100%);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4), 0 0 0 4px rgba(255, 255, 255, 0.25);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease, background 0.3s ease;
}
.play-btn-circle svg{
  margin-left: 3px;
  fill: #ffffff;
}
.play-pulse-ring{
  position: absolute;
  top: 12px;
  left: 50%;
  transform: translateX(-50%);
  width: 72px;
  height: 72px;
  border-radius: 50%;
  border: 2px solid rgba(209, 168, 104, 0.8);
  pointer-events: none;
  animation: playRippleAnim 2.4s cubic-bezier(0.16, 1, 0.3, 1) infinite;
}
@keyframes playRippleAnim{
  0%{transform: translateX(-50%) scale(1); opacity: 0.9;}
  100%{transform: translateX(-50%) scale(1.65); opacity: 0;}
}
.intro-video-play-btn:hover .play-btn-circle{
  transform: scale(1.12);
  background: linear-gradient(135deg, #e0ba7c 0%, #b88544 100%);
  box-shadow: 0 14px 38px rgba(107, 58, 30, 0.5), 0 0 0 6px rgba(209, 168, 104, 0.4);
}
.play-btn-label{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  transition: transform 0.2s ease;
}
.play-btn-label strong{
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #ffffff;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.7);
  transition: color 0.2s ease;
}
.play-btn-label small{
  font-family: var(--sans);
  font-size: 11.5px;
  color: rgba(255, 255, 255, 0.85);
  letter-spacing: .04em;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
}
.intro-video-play-btn:hover .play-btn-label strong{
  color: #d1a868;
}

/* ========================================================
 * Luxury Intro Stats Bar — Full Width Counter
 * ======================================================== */
.intro-stats-luxury-wrap{
  margin-top: 48px;
  width: 100%;
}
.intro-stats-luxury{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background: linear-gradient(135deg, #1C140E 0%, #2A1D15 50%, #18110B 100%);
  border: 1px solid rgba(212, 175, 55, 0.28);
  border-radius: 12px;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  overflow: hidden;
  position: relative;
}
.intro-stat-item{
  padding: 32px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
  transition: background-color 0.3s ease, transform 0.3s ease;
}
.intro-stat-item:not(:last-child)::after{
  content: '';
  position: absolute;
  right: 0;
  top: 20%;
  height: 60%;
  width: 1px;
  background: linear-gradient(180deg, rgba(212,175,55,0) 0%, rgba(212,175,55,0.3) 50%, rgba(212,175,55,0) 100%);
}
.intro-stat-item:hover{
  background: rgba(255, 255, 255, 0.04);
}
.stat-number-wrap{
  display: flex;
  align-items: baseline;
  justify-content: center;
  margin-bottom: 8px;
}
.stat-counter{
  font-family: var(--serif);
  font-size: 2.5rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1;
  background: linear-gradient(135deg, #FFF4D9 0%, #E8C882 60%, #D4AF37 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
  text-shadow: 0 2px 14px rgba(232, 200, 130, 0.25);
}
.stat-label{
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #D6CEBE;
  line-height: 1.45;
  max-width: 200px;
}
@media(max-width: 960px){
  .section-home-intro{
    padding: 44px 0 36px;
  }
  .intro-main-grid{
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .intro-col-left{
    width: 100%;
  }
  .intro-col-right{
    width: 100%;
  }
  .intro-video-card{
    border-radius: 14px;
  }
  .intro-video-heading{
    font-size: 1.65rem;
  }
  .intro-stats-luxury{
    grid-template-columns: repeat(2, 1fr);
  }
  .intro-stat-item:nth-child(2)::after{
    display: none;
  }
  .intro-stat-item:nth-child(1),
  .intro-stat-item:nth-child(2){
    border-bottom: 1px solid rgba(212, 175, 55, 0.15);
  }
  .intro-stat-item{
    padding: 24px 18px;
  }
  .stat-counter{
    font-size: 2rem;
  }
}
@media(max-width: 600px){
  .section-home-intro{
    padding: 32px 0 24px;
  }
  .intro-main-grid{
    gap: 24px;
  }
  .intro-col-left .intro-slide h2{
    font-size: 1.65rem;
    line-height: 1.3;
  }
  .intro-col-left .intro-slide .lead{
    font-size: 14.5px;
    line-height: 1.65;
  }
  .intro-col-left .intro-slide p:not(.lead){
    font-size: 14px;
    line-height: 1.6;
  }
  .intro-cta-actions{
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    margin-top: 20px;
  }
  .intro-cta-actions .btn{
    justify-content: center;
    width: 100%;
    height: 46px;
  }
  .intro-video-overlay{
    padding: 24px 16px;
    gap: 12px;
  }
  .intro-video-heading{
    font-size: 1.35rem;
    line-height: 1.3;
  }
  .play-btn-circle{
    width: 58px;
    height: 58px;
  }
  .play-pulse-ring{
    width: 58px;
    height: 58px;
  }
}
@media(max-width: 540px){
  .intro-stats-luxury-wrap{
    margin-top: 28px;
  }
  .intro-stats-luxury{
    grid-template-columns: 1fr 1fr;
    border-radius: 8px;
  }
  .intro-stat-item{
    padding: 16px 10px;
  }
  .stat-counter{
    font-size: 1.55rem;
  }
  .stat-label{
    font-size: 9.5px;
    letter-spacing: 0.08em;
  }
}
.trust-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:36px;text-align:left}
.trust-strip h3{font-size:1.05rem;letter-spacing:.05em;text-transform:uppercase;font-family:var(--sans);font-weight:500}
.trust-strip p{color:#555;font-size:.97rem}
.trust-icon{font-size:1.6rem;color:var(--brand);margin-bottom:10px}
@media(max-width:900px){.trust-strip{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.trust-strip{grid-template-columns:1fr}}
/* Category tabs */
.cat-tabs{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:32px 0 36px}
.cat-tab{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  border:1.5px solid #dcd5cc;
  background:#fff;
  color:#222;
  padding:0 24px;
  font-size:12.5px;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-weight:600;
  cursor:pointer;
  transition:all .22s cubic-bezier(0.16,1,0.3,1);
  font-family:var(--sans);
  border-radius:var(--radius-sm, 8px) !important;
  box-shadow:0 1px 3px rgba(0,0,0,.03);
}
.cat-tab:hover{
  border-color:var(--brand);
  color:var(--brand);
  background:#FAF7F2;
  transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(107,58,30,.12);
}
.cat-tab.active{
  background:var(--brand) !important;
  border-color:var(--brand) !important;
  color:#fff !important;
  box-shadow:0 4px 14px rgba(107,58,30,.26) !important;
}
.cat-panel{display:none}
.cat-panel.active{display:block}
/* Mobile: one nav, toggles in both layouts */
@media(max-width:900px){
  .site-header.header-left .header-in,
  .site-header.header-center .header-in{display:flex;align-items:center;justify-content:space-between;min-height:var(--header-height-mobile, 64px);height:auto;gap:12px;padding:6px 16px}
  .site-header .main-nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--line);padding:20px 24px;z-index:60;box-shadow:0 8px 24px rgba(0,0,0,.08);max-height:80vh;overflow-y:auto}
  .site-header .main-nav.open{display:block}
  .site-header .main-nav > ul{display:flex;flex-direction:column;gap:16px;list-style:none;margin:0;padding:0}
  .site-header .main-nav a{display:block;padding:8px 0;font-size:16px;font-weight:600;letter-spacing:.03em;color:var(--ink)}
  .site-header .main-nav li.menu-item-has-children{position:relative}
  .site-header .main-nav li.menu-item-has-children > a{display:flex;justify-content:space-between;align-items:center}
  .site-header .main-nav li.menu-item-has-children > a:after{content:none !important}
  .site-header .main-nav ul.sub-menu{display:none !important;list-style:none;padding:10px 14px;margin:8px 0 12px;background:#faf8f5;border-left:3px solid var(--brand);border-radius:4px;grid-template-columns:1fr 1fr;gap:6px 14px;position:static !important;box-shadow:none !important;width:auto !important;opacity:1 !important;visibility:visible !important;transform:none !important}
  .site-header .main-nav li.menu-item-has-children.open > ul.sub-menu{display:grid !important}
  .site-header .main-nav ul.sub-menu li{border-bottom:1px solid #eee7df;padding:3px 0}
  .site-header .main-nav ul.sub-menu li a{font-size:15px;font-weight:500;color:#222;padding:6px 4px;text-transform:none;display:block}
  .site-header .main-nav ul.sub-menu li a:before{display:none !important}
  .whatsapp-btn span{display:none !important}
  .whatsapp-btn{padding:0 !important;background:transparent !important;border:none !important;box-shadow:none !important;width:38px !important;height:38px !important;min-width:38px !important;min-height:38px !important;display:inline-flex !important;align-items:center !important;justify-content:center !important}
  .hotline{display:none !important}
  .custom-logo{max-height:48px !important;max-width:160px !important;width:auto !important;height:auto !important;object-fit:contain !important}
  .menu-toggle-btn{display:inline-flex !important;align-items:center;justify-content:center;width:38px !important;height:38px !important;padding:0 !important;border:none;background:transparent}
  .menu-toggle-btn .menu-text{display:none !important}
}

/* ============ VIERAHAIR 1.3.0 — intro slider ============ */
.intro-slider{position:relative}
.intro-slides{position:relative;min-height:340px}
.intro-slide{display:none}
.intro-slide.active{display:block;animation:introFade .55s ease}
@keyframes introFade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.intro-nav{display:flex;align-items:center;gap:18px;margin:22px 0 26px}
.intro-arrow{width:46px;height:46px;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:20px;line-height:1;cursor:pointer;transition:.2s;flex-shrink:0}
.intro-arrow:hover{background:var(--brand);border-color:var(--brand);color:#fff}
.intro-dots{display:flex;gap:9px;align-items:center}
.intro-dot{width:11px;height:11px;border-radius:50%;border:0;background:#d8d2ca;cursor:pointer;padding:0;transition:.25s}
.intro-dot.active{background:var(--brand);width:30px;border-radius:6px}
@media(max-width:900px){.intro-slides{min-height:0}}

/* ============ VIERAHAIR — Modern Luxury Hero Banner / Slider ============ */
.hero-slider-section{position:relative;width:100%;overflow:hidden;background:#0d0d0d;color:#fff;line-height:0}
.hero-slider-wrap{position:relative;width:100%;margin:0;padding:0;overflow:hidden;line-height:0;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:pan-y}
.hero-slider-wrap.is-dragging{cursor:grabbing}
.hero-slider-wrap.is-dragging .hero-slide-link{pointer-events:none}
.hero-slides{display:grid;grid-template-columns:1fr;grid-template-rows:1fr;width:100%;margin:0;padding:0;line-height:0}
.hero-slide{grid-area:1 / 1 / 2 / 2;position:relative;width:100%;line-height:0;opacity:0;visibility:hidden;transition:opacity .75s cubic-bezier(.4,0,.2,1),visibility .75s ease;pointer-events:none;z-index:1}
.hero-slide.active{opacity:1;visibility:visible;pointer-events:auto;z-index:2}
.hero-slide.slide-from-right{animation:heroSlideFromRight .6s cubic-bezier(.25,1,.5,1) both}
.hero-slide.slide-from-left{animation:heroSlideFromLeft .6s cubic-bezier(.25,1,.5,1) both}
@keyframes heroSlideFromRight{from{opacity:0;transform:translateX(36px)}to{opacity:1;transform:translateX(0)}}
@keyframes heroSlideFromLeft{from{opacity:0;transform:translateX(-36px)}to{opacity:1;transform:translateX(0)}}
.hero-slide-picture{display:block;width:100%;margin:0;padding:0;line-height:0}
.hero-slide-img{display:block;width:100%;height:auto;max-width:100%;object-fit:contain;margin:0;padding:0;border:0;line-height:0;transform:scale(1);transition:transform 7s ease-out;will-change:transform;-webkit-user-drag:none;-webkit-user-select:none;user-select:none;pointer-events:none}
.hero-slider-wrap[data-fit="natural"] .hero-slide-img{width:100%!important;height:auto!important;object-fit:contain!important}
.hero-slider-wrap[data-fit="cover"] .hero-slide-img{width:100%!important;height:100%!important;min-height:520px;object-fit:cover!important}
.hero-slider-wrap[data-fit="contain"] .hero-slide-img{width:100%!important;height:auto!important;max-height:80vh;object-fit:contain!important;margin:0 auto}
.hero-slide-link{position:absolute;inset:0;width:100%;height:100%;z-index:4;display:block;text-decoration:none;cursor:pointer}
/* Effects */
.hero-slide.active[data-effect="kenburns"] .hero-slide-img,
.hero-slider-wrap[data-global-effect="kenburns"] .hero-slide.active .hero-slide-img{transform:scale(1.04)}
.hero-slide[data-effect="slide"]{transform:translateX(30px);transition:opacity .7s ease,transform .7s ease,visibility .7s}
.hero-slide.active[data-effect="slide"]{transform:translateX(0)}
/* Overlay for text */
.hero-slide-overlay{position:absolute;inset:0;width:100%;height:100%;background:linear-gradient(180deg,rgba(17,17,17,.2) 0%,rgba(17,17,17,.65) 100%);pointer-events:none;z-index:2}
.hero-slide-wrap-inner{position:absolute;inset:0;z-index:3;width:100%;height:100%;display:flex;align-items:center;line-height:1.6}
.hero-slide-wrap-inner.align-center{justify-content:center;text-align:center}
.hero-slide-content{width:100%;max-width:760px;color:#fff;padding:40px 0;margin:0 auto;text-align:center}
.hero-slide-wrap-inner.align-center .hero-slide-content{margin:0 auto;text-align:center}
.hero-slide-wrap-inner.align-center .hero-slide-desc{margin-left:auto;margin-right:auto;text-align:center}
.hero-slide-wrap-inner.align-center .hero-slide-actions{justify-content:center}
.hero-slide-eyebrow{font-size:12.5px;letter-spacing:.26em;text-transform:uppercase;color:#dfb288;font-weight:600;margin-bottom:16px;opacity:1;text-shadow:0 1px 6px rgba(0,0,0,.7)}
.hero-slide-title{font-family:var(--serif);font-size:clamp(2.4rem,4.6vw,4.2rem);font-weight:500;line-height:1.14;margin:0 0 18px;color:#fff;opacity:1;text-shadow:0 2px 12px rgba(0,0,0,.8)}
.hero-slide-desc{font-family:var(--sans);font-size:1.05rem;line-height:1.7;color:#f0f0f0;margin:0 0 32px;max-width:620px;opacity:1;text-shadow:0 1px 6px rgba(0,0,0,.7)}
.hero-slide-actions{display:flex;gap:16px;flex-wrap:wrap;opacity:1}
/* Slide Content Entrance Keyframes */
.hero-slide.active .hero-slide-eyebrow{animation:heroContentUp .7s cubic-bezier(.16,1,.3,1) .1s both}
.hero-slide.active .hero-slide-title{animation:heroContentUp .8s cubic-bezier(.16,1,.3,1) .2s both}
.hero-slide.active .hero-slide-desc{animation:heroContentUp .8s cubic-bezier(.16,1,.3,1) .3s both}
.hero-slide.active .hero-slide-actions{animation:heroContentUp .8s cubic-bezier(.16,1,.3,1) .4s both}
@keyframes heroContentUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
/* Arrows — Large & thin chevrons, transparent background */
.hero-slider-nav{position:absolute;inset:0;pointer-events:none;z-index:6}
.hero-slider-arrow{pointer-events:auto;position:absolute;top:50%;transform:translateY(-50%);width:72px;height:110px;background:transparent !important;border:none !important;box-shadow:none !important;border-radius:0 !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important;color:#ffffff;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0;outline:none;filter:drop-shadow(0 3px 12px rgba(0,0,0,0.75));opacity:.88;transition:transform .22s ease,opacity .22s ease,filter .22s ease}
.hero-slider-arrow:hover{background:transparent !important;border:none !important;color:#ffffff;opacity:1;transform:translateY(-50%) scale(1.15);filter:drop-shadow(0 4px 20px rgba(0,0,0,0.95))}
.hero-slider-arrow:active{transform:translateY(-50%) scale(0.96)}
.hero-slider-arrow svg{display:block;width:60px;height:60px;stroke-width:1.15;pointer-events:none}
.hero-prev{left:24px}
.hero-next{right:24px}
/* Dots */
.hero-slider-dots{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);z-index:6;display:flex;gap:8px;align-items:center}
.hero-slider-dot{width:24px;height:4px;border:0;border-radius:2px;background:rgba(255,255,255,.4);cursor:pointer;padding:0;transition:.3s}
.hero-slider-dot:hover{background:rgba(255,255,255,.75)}
.hero-slider-dot.active{width:46px;background:#fff}

/* ============ VIERAHAIR — Mobile Refinements & Proportions ============ */
@media(max-width:900px){
  .hero-slider-arrow{display:inline-flex !important;width:42px;height:60px;opacity:.95}
  .hero-slider-arrow svg{width:36px;height:36px;stroke-width:1.3}
  .hero-prev{left:6px}
  .hero-next{right:6px}
  .hero-slider-dots{bottom:14px}
}
@media(max-width:480px){
  .hero-slider-arrow{width:38px;height:52px}
  .hero-slider-arrow svg{width:32px;height:32px;stroke-width:1.35}
  .hero-prev{left:4px}
  .hero-next{right:4px}
  .hero-slider-dots{bottom:10px}
}

@media(max-width:768px){
  body{font-size:15px;line-height:1.6}
  .wrap{padding:0 16px}
  .section{padding:48px 0}
  .lead{font-size:14.5px;line-height:1.55}
  h1{font-size:clamp(1.75rem, 6.2vw, 2.3rem)}
  .page-head h1{font-size:clamp(1.6rem, 6.5vw, 2.2rem) !important;word-break:break-word}
  h2{font-size:clamp(1.4rem, 5vw, 1.85rem)}
  h3{font-size:1.15rem}
  .eyebrow{font-size:11px;letter-spacing:.22em}
  .rule{margin:14px auto;width:44px}
  .btn{padding:11px 22px;font-size:11.5px;letter-spacing:.12em}

  /* Header on Mobile */
  .announce{font-size:10.5px;letter-spacing:.08em;padding:6px 12px;line-height:1.35;white-space:normal;text-align:center}
  .site-header{position:sticky;top:0;width:100%}
  .site-header.header-left .header-in,
  .site-header.header-center .header-in{
    display:flex !important;
    justify-content:space-between !important;
    align-items:center !important;
    height:64px;
    padding:0 14px !important;
    box-sizing:border-box !important;
    width:100% !important;
  }
  .header-logo-left{display:flex;align-items:center;flex:0 1 auto;min-width:0}
  .logo{font-size:20px;letter-spacing:.1em;white-space:nowrap}
  .logo small{font-size:8px;letter-spacing:.22em}
  .custom-logo{max-height:52px !important;max-width:170px;width:auto !important;height:auto !important}
  div.header-left, .header-in > .header-left{display:none !important}
  .header-right{display:flex !important;align-items:center;justify-content:flex-end;gap:6px;flex:0 0 auto}
  .header-right .hotline{display:none !important}

  /* Hero Slider on Mobile */
  .hero-slider-dots{bottom:10px}
  .hero-slider-dot{width:16px;height:3px}
  .hero-slider-dot.active{width:28px}

  /* Shop by Type on Mobile: 2 Columns */
  .grid-4{grid-template-columns:repeat(2,1fr);gap:12px}
  .card-type .card-body{padding:14px 12px 18px}
  .card-type .card-body h3{font-size:1.02rem;margin-bottom:4px}
  .card-type .card-body p{font-size:12.5px;line-height:1.45;margin-bottom:8px;color:#666;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .card-type .card-cta{font-size:10px;letter-spacing:.12em;margin-top:4px}

  /* Category Tabs & Shop Filter Chips Horizontal Touch-Scroll */
  .cat-tabs,
  .cat-chips,
  .cat-chips.shop-cat-chips{
    display:flex !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch;
    gap:8px !important;
    padding:6px 16px 14px !important;
    margin:16px -16px 24px !important;
    justify-content:flex-start !important;
    scrollbar-width:none !important;
    width:auto !important;
    max-width:none !important;
  }
  .cat-tabs::-webkit-scrollbar,
  .cat-chips::-webkit-scrollbar,
  .cat-chips.shop-cat-chips::-webkit-scrollbar{
    display:none !important;
  }
  .cat-tab,
  .cat-chips a,
  .cat-chips.shop-cat-chips a{
    flex-shrink:0 !important;
    min-height:44px !important;
    padding:0 18px !important;
    font-size:12px !important;
    letter-spacing:.06em !important;
    font-weight:600 !important;
    white-space:nowrap !important;
    border-radius:var(--radius-sm, 8px) !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
  }

  /* WooCommerce Product Cards on Mobile: 2 Columns */
  .woocommerce ul.products{grid-template-columns:repeat(2,1fr)!important;gap:12px!important}
  .woocommerce ul.products li.product{padding:12px 10px 16px!important}
  .woocommerce ul.products li.product img{margin-bottom:8px!important}
  .woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:13px;line-height:1.28;min-height:2.6em;margin-bottom:4px}
  .woocommerce ul.products li.product .price{font-size:13px;margin-bottom:8px}
  .woocommerce ul.products li.product .button{padding:8px 10px!important;font-size:10.5px!important;width:100%!important;letter-spacing:.08em}

  /* Split & Stats on Mobile */
  .split-img{min-height:220px;padding:24px 16px}
  .split-img .big{font-size:1.4rem}
  .intro-stats>div{padding:12px 14px}
  .intro-stats b{font-size:1.35rem}
  .intro-stats span{font-size:10.5px}

  /* Trust Strip on Mobile: 2 Columns */
  .trust-strip{grid-template-columns:1fr 1fr;gap:16px;margin-top:24px}
  .trust-strip h3{font-size:.92rem}
  .trust-strip p{font-size:.85rem;line-height:1.45}
  .trust-icon{font-size:1.3rem;margin-bottom:6px}

  /* Steps on Mobile */
  .grid-3{grid-template-columns:1fr;gap:14px}
  .grid-3 .card-body{padding:18px 20px}

  /* Footer on Mobile: 12 / 6|6 / 12 / 12 Layout */
  .footer-grid{
    display: grid !important;
    grid-template-columns: repeat(12, 1fr) !important;
    gap: 32px 16px !important;
    padding: 44px 0 28px !important;
  }
  .footer-col-brand{ grid-column: span 12 !important; }
  .footer-col-nav{ grid-column: span 6 !important; }
  .footer-col-contact{ grid-column: span 12 !important; }
  .footer-col-newsletter{ grid-column: span 12 !important; }
  .site-footer h4{font-size:12.5px;letter-spacing:.12em;margin-bottom:14px}
  .site-footer p,.site-footer li{font-size:13.5px;line-height:1.55}
  .site-footer a{font-size:13.5px}
  .footer-bottom{font-size:12px;flex-direction:column;gap:12px;text-align:center}
}

@media(max-width:400px){
  .site-header.header-left .header-in,
  .site-header.header-center .header-in{padding:0 10px !important;min-height:var(--header-height-mobile, 60px) !important;height:var(--header-height-mobile, 60px) !important}
  .logo{font-size:18px}
  .custom-logo{max-height:var(--header-logo-h-mobile, 44px) !important;max-width:140px !important}
  .header-right{gap:6px !important}
  .whatsapp-btn{padding:0 !important;background:transparent !important;border:none !important}
  .menu-toggle{padding:6px 9px;font-size:10.5px}
  .grid-4{gap:8px}
  .woocommerce ul.products{gap:8px!important}
  .woocommerce ul.products li.product{padding:8px 8px 12px!important}
  .woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:12px}
  .woocommerce ul.products li.product .price{font-size:12px}
  .trust-strip{grid-template-columns:1fr;gap:12px}
}


/* ==========================================================================
   VIERAHAIR — Modern Header, Mobile Drawer, Marquee, Cart Sidebar & CWV Suite
   ========================================================================== */

/* 1. Header Sticky & Scroll Animation */
.site-header{
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: background-color, box-shadow, padding;
}
.site-header.is-scrolled{
  background: rgba(255, 255, 255, 0.96) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  border-bottom-color: rgba(213, 207, 199, 0.8);
}
.site-header.is-scrolled .header-in{
  min-height: var(--header-height-scrolled, 70px) !important;
  height: var(--header-height-scrolled, 70px) !important;
  padding: 0 24px !important;
}

/* ============ Modern E-Commerce Navigation (Flush Bottom-Edge Line & Micro-Animations) ============ */
@media (min-width: 901px) {
  .site-header {
    border-bottom: 1px solid var(--line);
  }
  .site-header .header-in,
  .site-header.header-left .header-in,
  .site-header.header-center .header-in {
    min-height: var(--header-height, 86px);
    height: var(--header-height, 86px);
    padding: 0 24px;
    align-items: stretch;
    position: relative;
    box-sizing: border-box;
  }
  .header-logo-left,
  .header-logo-center {
    display: flex;
    align-items: center;
    height: 100%;
  }
  .header-logo-center {
    justify-content: center;
  }
  .header-right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
    height: 100%;
  }
  .main-nav {
    display: flex;
    align-items: stretch;
    height: 100%;
  }
  .site-header.header-left .main-nav {
    justify-content: center;
  }
  .site-header.header-center .main-nav {
    justify-content: flex-start;
  }
  .main-nav > ul {
    display: flex;
    align-items: stretch;
    height: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    gap: 4px;
  }
  .main-nav > ul > li {
    display: flex;
    align-items: stretch;
    height: 100%;
    position: relative;
  }
  .main-nav > ul > li.mega-menu {
    position: static; /* Center the mega dropdown relative to .header-in */
  }
  .main-nav > ul > li > a {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 100%;
    padding: 0 16px;
    font-family: var(--sans);
 
    font-weight: bold;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #1e1e1e;
    background-color: transparent !important;
    text-decoration: none;
    box-sizing: border-box;
    transition: color 0.22s ease;
  }
  .main-nav > ul > li > a .menu-label {
    position: relative;
    display: inline-block;
  }

  /* Dropdown Chevron Toggle & Rotation */
  .menu-dropdown-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    color: currentColor;
    opacity: 0.85;
    margin-left: 2px;
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s ease, color 0.2s ease;
    flex-shrink: 0;
    vertical-align: middle;
  }
  .menu-dropdown-toggle svg {
    display: block;
    width: 12px;
    height: 12px;
    stroke-width: 2.2;
  }
  .main-nav li.menu-item-has-children:hover > a .menu-dropdown-toggle,
  .main-nav li.menu-item-has-children.hover > a .menu-dropdown-toggle,
  .main-nav li.menu-item-has-children:focus-within > a .menu-dropdown-toggle {
    transform: rotate(180deg);
    opacity: 1;
    color: var(--brand);
  }

  /* Hover & Active text colours */
  .main-nav > ul > li:hover > a,
  .main-nav > ul > li > a:hover {
    color: var(--brand);
    background-color: transparent !important;
    text-decoration: none;
  }
  .main-nav > ul > li.current-menu-item > a,
  .main-nav > ul > li.current_page_item > a,
  .main-nav > ul > li.current-menu-ancestor > a,
  .main-nav > ul > li.current-page-ancestor > a {
    color: var(--brand);
    font-weight: 600;
    background-color: transparent !important;
    text-decoration: none;
  }

  /* Border-Bottom Indicator: Sát mép viền dưới Header với hiệu ứng dài ra thu vào mượt mà */
  .main-nav > ul > li > a::after {
    content: "" !important;
    position: absolute;
    bottom: 0;
    left: 12px;
    right: 12px;
    height: 2.5px;
    background-color: var(--brand);
    border-radius: 0 !important;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s ease;
    opacity: 0;
    pointer-events: none;
    z-index: 2;
  }
  /* Hover: Dài ra */
  .main-nav > ul > li:hover > a::after,
  .main-nav > ul > li > a:hover::after {
    transform: scaleX(1);
    opacity: 1;
  }
  /* Active Link: Giữ nguyên vạch viền sát mép */
  .main-nav > ul > li.current-menu-item > a::after,
  .main-nav > ul > li.current_page_item > a::after,
  .main-nav > ul > li.current-menu-ancestor > a::after,
  .main-nav > ul > li.current-page-ancestor > a::after {
    transform: scaleX(1);
    opacity: 1;
  }

  /* Scrolled State: Vạch viền menu luôn vuông vức, không bo góc và bám sát mép viền dưới */
  .site-header.is-scrolled .main-nav > ul > li > a::after {
    bottom: 0 !important;
    border-radius: 0 !important;
  }

  /* Submenu Hover Bridge: Ngăn mất focus khi rê chuột từ viền xuống menu thả xuống */
  .main-nav ul.sub-menu::before {
    content: "";
    position: absolute;
    top: -14px;
    left: 0;
    right: 0;
    height: 14px;
    background: transparent;
  }

  /* Standard Dropdown (Non-Mega) */
  .main-nav ul.sub-menu:not(.mega-sub-menu) {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 240px;
    background: #ffffff;
    border: 1px solid #ded9d0;
    border-radius: 8px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.1);
    padding: 10px 0;
    margin: 0;
    list-style: none;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    pointer-events: none;
    transition: opacity 0.25s ease, transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.25s;
    z-index: 100;
  }
  .main-nav li:hover > ul.sub-menu:not(.mega-sub-menu) {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }
  .main-nav ul.sub-menu:not(.mega-sub-menu) li a {
    display: flex;
    align-items: center;
    padding: 9px 18px;
    font-size: 14.5px;
    font-weight: 500;
    color: var(--ink);
    text-transform: none;
    transition: all 0.2s ease;
  }
  .main-nav ul.sub-menu:not(.mega-sub-menu) li a:hover {
    background: #faf8f5;
    color: var(--brand);
    transform: translateX(4px);
  }

  /* ============ Luxury Mega Menu with Flush Image Banner ============ */
  .main-nav li.mega-menu ul.sub-menu.mega-sub-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(8px);
    width: 820px;
    max-width: calc(100vw - 32px);
    background: #ffffff;
    border: 1px solid #ded9d0;
    border-radius: 12px;
    box-shadow: 0 24px 55px -10px rgba(0, 0, 0, 0.16), 0 4px 14px rgba(0, 0, 0, 0.04);
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-direction: row;
    overflow: hidden; /* Sát mép viền: Banner bo góc chuẩn theo khung viền dropdown */
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.26s cubic-bezier(0.16, 1, 0.3, 1), transform 0.26s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.26s;
    z-index: 100;
  }
  /* Vị trí Banner bên trái (sát mép trái) */
  .main-nav li.mega-menu ul.sub-menu.mega-sub-menu.mega-pos-left {
    flex-direction: row-reverse;
  }

  .main-nav li.mega-menu:hover > ul.sub-menu.mega-sub-menu,
  .main-nav li.mega-menu.hover > ul.sub-menu.mega-sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
    pointer-events: auto;
  }

  /* Cột danh mục sản phẩm (Categories Column) */
  .mega-cats-column {
    flex: 1 1 auto;
    min-width: 0;
    padding: 24px 28px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .mega-cats-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 12px;
    margin-bottom: 14px;
    border-bottom: 1px solid #f2ede6;
  }
  .mega-cats-title {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #8c827a;
  }
  .mega-cats-all {
    font-size: 12px;
    font-weight: 600;
    color: var(--brand);
    text-decoration: none;
    letter-spacing: 0.02em;
    transition: color 0.18s ease;
  }
  .mega-cats-all:hover {
    color: #1e1e1e;
    text-decoration: underline;
  }
  .mega-cats-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 16px;
    list-style: none;
    margin: 0;
    padding: 0;
  }
  .mega-cats-grid li {
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .mega-cats-grid li a {
    display: flex;
    align-items: center;
    padding: 8px 12px;
    border-radius: 6px;
    font-family: var(--sans);
    font-size: 14px;
    font-weight: 500;
    color: #28231f;
    text-transform: none;
    text-decoration: none;
    transition: all 0.18s ease;
    background: transparent;
  }
  .mega-cats-grid li a:hover {
    background: #faf6f0;
    color: var(--brand);
    padding-left: 16px;
    font-weight: 600;
    text-decoration: none;
  }

  /* Cột hình ảnh Banner (Sát mép phải hoặc sát mép trái) */
  .mega-banner-item {
    flex: 0 0 310px;
    width: 310px;
    min-height: 350px;
    position: relative;
    display: flex;
    overflow: hidden;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
  }
  .mega-banner-card {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    width: 100%;
    height: 100%;
    min-height: 350px;
    padding: 26px 22px;
    position: relative;
    text-decoration: none;
    color: #ffffff;
    overflow: hidden;
    box-sizing: border-box;
  }
  .mega-banner-card:hover {
    text-decoration: none;
    color: #ffffff;
  }
  .mega-banner-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
    z-index: 1;
  }
  .mega-banner-card:hover .mega-banner-bg {
    transform: scale(1.06);
  }
  .mega-banner-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(17, 14, 12, 0.15) 0%, rgba(17, 14, 12, 0.45) 45%, rgba(17, 14, 12, 0.94) 100%);
    z-index: 2;
  }
  .mega-banner-content {
    position: relative;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .mega-banner-badge {
    display: inline-block;
    padding: 4px 11px;
    background: var(--brand);
    color: #ffffff;
    border-radius: 20px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    border: 1px solid rgba(255, 255, 255, 0.25);
    backdrop-filter: blur(4px);
    line-height: 1.2;
  }
  .mega-banner-title {
    font-family: var(--serif);
    font-size: 19px;
    line-height: 1.28;
    font-weight: 600;
    color: #ffffff;
    margin: 0;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
  }
  .mega-banner-desc {
    font-family: var(--sans);
    font-size: 12px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.88);
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .mega-banner-btn {
    display: inline-flex;
    align-items: center;
    margin-top: 6px;
    padding: 7px 15px;
    background: #ffffff;
    color: #1e1e1e;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    border-radius: 4px;
    transition: all 0.22s ease;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  }
  .mega-banner-card:hover .mega-banner-btn {
    background: var(--brand);
    color: #ffffff;
    transform: translateX(3px);
  }
}

/* ============ H2 & Section Titles on White / Light Surfaces (Brand Color) ============ */
.cat-tabs-section h2,
.section:not(.black):not(.dark) h2,
.section.ivory h2,
.site-main section:not(.black):not(.dark) h2,
.page-template h2:not(.on-dark),
.section-shop-by-type h2,
.section-trust-pillars h2,
.section-bottom-cta h2,
.woocommerce .related.products > h2,
.woocommerce .upsells.products > h2,
.woocommerce .cart_totals h2,
.page-head h1,
.entry h2{
  color: var(--brand);
}
.section.black h2,
.section.dark h2,
.section-dark h2,
.hero h2{
  color: #ffffff !important;
}

/* 2. Hamburger Animated Button */
.menu-toggle-btn{
  display: none;
  background: transparent;
  border: 1px solid transparent;
  cursor: pointer;
  padding: 8px;
  border-radius: 4px;
  align-items: center;
  gap: 8px;
  color: var(--ink);
  transition: all 0.2s ease;
}
.menu-toggle-btn:hover{
  background: #f7f5f2;
}
.hamburger-box{
  width: 22px;
  height: 16px;
  position: relative;
  display: inline-block;
}
.hamburger-inner,
.hamburger-inner::before,
.hamburger-inner::after{
  width: 22px;
  height: 2px;
  background-color: var(--ink);
  position: absolute;
  border-radius: 2px;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.3s;
}
.hamburger-inner{
  top: 50%;
  transform: translateY(-50%);
}
.hamburger-inner::before{
  content: '';
  top: -6px;
}
.hamburger-inner::after{
  content: '';
  bottom: -6px;
}
.menu-toggle-btn.is-active .hamburger-inner{
  background-color: transparent !important;
}
.menu-toggle-btn.is-active .hamburger-inner::before{
  transform: translateY(6px) rotate(45deg);
  background-color: var(--brand);
}
.menu-toggle-btn.is-active .hamburger-inner::after{
  transform: translateY(-6px) rotate(-45deg);
  background-color: var(--brand);
}
.menu-text{
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

@media (max-width: 960px){
  .site-header .header-in,
  .site-header.header-left .header-in,
  .site-header.header-center .header-in{
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    min-height: var(--header-height-mobile, 64px) !important;
    height: var(--header-height-mobile, 64px) !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
    width: 100% !important;
  }
  .header-logo-left,
  .header-logo-center{
    display: flex !important;
    align-items: center !important;
    flex: 0 1 auto !important;
    max-width: 50% !important;
    line-height: 1 !important;
  }
  .custom-logo{
    max-height: var(--header-logo-h-mobile, 44px) !important;
    max-width: 150px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
  }
  div.header-left,
  .header-in > .header-left{
    display: none !important;
  }
  .header-right{
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    flex: 0 0 auto !important;
  }
  .header-right .hotline{
    display: none !important;
  }
  .whatsapp-btn,
  .cart-link,
  .menu-toggle-btn{
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    box-sizing: border-box !important;
    flex-shrink: 0 !important;
    line-height: 1 !important;
    vertical-align: middle !important;
    border-radius: 6px !important;
  }
  .whatsapp-btn{
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: transparent !important;
    border-radius: 0 !important;
  }
  .whatsapp-btn span{
    display: none !important;
  }
  .whatsapp-btn .vh-wa-img,
  .whatsapp-btn svg{
    display: block !important;
    width: 28px !important;
    height: 28px !important;
    margin: auto !important;
  }
  .cart-link{
    position: relative !important;
    background: transparent !important;
    color: var(--ink) !important;
  }
  .cart-link svg{
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    margin: auto !important;
  }
  .cart-link .cart-count{
    position: absolute !important;
    top: 0px !important;
    right: 0px !important;
    width: 17px !important;
    height: 17px !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 17px !important;
    text-align: center !important;
    margin: 0 !important;
    border-radius: 50% !important;
    background: var(--brand) !important;
    color: #fff !important;
  }
  .menu-toggle-btn{
    background: transparent !important;
    color: var(--ink) !important;
    cursor: pointer !important;
    padding: 0 !important;
  }
  .menu-toggle-btn svg{
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    margin: auto !important;
  }
  .menu-toggle-btn:active{
    background: rgba(0, 0, 0, 0.05) !important;
  }
  .site-header .main-nav,
  .main-nav{
    display: none !important;
  }
}

/* 3. Luxury Off-Canvas Mobile Drawer */
.mobile-drawer-backdrop{
  position: fixed;
  inset: 0;
  background: rgba(17, 17, 17, 0.65);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 9998;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.35s;
}
.mobile-drawer-backdrop.open{
  opacity: 1;
  visibility: visible;
}
.mobile-drawer{
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  width: 86%;
  max-width: 380px;
  background: #ffffff;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  box-shadow: 12px 0 48px rgba(0, 0, 0, 0.22);
  transform: translate3d(-100%, 0, 0);
  transition: transform 0.38s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform;
  overflow-y: auto;
}
.mobile-drawer.open{
  transform: translate3d(0, 0, 0);
}
body.mobile-drawer-open{
  overflow: hidden !important;
}
.mobile-drawer-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 24px;
  border-bottom: 1px solid var(--line);
  background: #faf8f5;
}
.mobile-drawer-close{
  background: #fff;
  border: 1px solid var(--line);
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--ink);
  transition: all 0.2s ease;
}
.mobile-drawer-close:hover{
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
  transform: rotate(90deg);
}
.mobile-drawer-body{
  padding: 24px;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.mobile-nav-list{
  list-style: none;
  margin: 0;
  padding: 0;
}
.mobile-nav-list > li{
  border-bottom: 1px solid #f0ede8;
}
.mobile-nav-list > li > a{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--ink);
  text-decoration: none;
  letter-spacing: .02em;
  transition: color 0.2s ease;
}
.mobile-nav-list > li > a:hover{
  color: var(--brand);
}
.mobile-nav-list > li.current-menu-item > a,
.mobile-nav-list > li.current_page_item > a{
  color: var(--brand);
  font-weight: 700;
}
.mobile-nav-list li.menu-item-has-children > a::after{
  content: none !important;
}
.mobile-nav-list .menu-dropdown-toggle{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  border-radius: 8px !important;
  background: #f4f0eb !important;
  color: var(--ink) !important;
  margin-left: auto !important;
  padding: 0 !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.2s ease, color 0.2s ease;
}
.mobile-nav-list .menu-dropdown-toggle svg{
  display: block !important;
  width: 14px !important;
  height: 14px !important;
  margin: auto !important;
  stroke: currentColor !important;
  stroke-width: 2.2 !important;
}
.mobile-nav-list li.menu-item-has-children.open > a .menu-dropdown-toggle{
  transform: rotate(180deg);
  background: var(--brand) !important;
  color: #ffffff !important;
}
.mobile-nav-list ul.sub-menu{
  display: none;
  list-style: none;
  margin: 0;
  padding: 6px 0 14px 16px;
  background: #faf8f5;
  border-left: 3px solid var(--brand);
}
.mobile-nav-list li.menu-item-has-children.open > ul.sub-menu{
  display: block;
}
.mobile-nav-list ul.sub-menu li a{
  display: block;
  padding: 8px 0;
  font-size: 14.5px;
  color: #444;
  text-decoration: none;
}
.mobile-nav-list ul.sub-menu li a:hover{
  color: var(--brand);
}
.mobile-drawer-actions{
  margin-top: 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.mobile-wa-btn{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  padding: 12px 18px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .06em;
  background: #25D366 !important;
  border: 1px solid #25D366 !important;
  color: #ffffff !important;
  border-radius: 8px !important;
}
.mobile-wa-btn:hover{
  background: #1eb856 !important;
  border-color: #1eb856 !important;
  color: #ffffff !important;
  text-decoration: none;
}
.mobile-contact-strip{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 6px;
}
.mobile-contact-pill{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 12px;
  background: #f7f5f2;
  border: 1px solid var(--line);
  border-radius: 8px !important;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
  text-decoration: none;
}
.mobile-drawer-footer{
  padding: 16px 24px;
  background: #faf8f5;
  border-top: 1px solid var(--line);
}
.mobile-trust-note{
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #666;
}

/* 4. Luxury Infinite Marquee Ticker */
.luxe-marquee-wrap{
  background: #111111;
  color: #f7f5f2;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  overflow: hidden;
  padding: 13px 0;
  display: flex;
  user-select: none;
}
.luxe-marquee-track{
  display: flex;
  width: max-content;
  animation: luxeMarqueeAnim 35s linear infinite;
  will-change: transform;
}
.luxe-marquee-wrap:hover .luxe-marquee-track{
  animation-play-state: paused;
}
.luxe-marquee-content{
  display: flex;
  align-items: center;
  white-space: nowrap;
}
.luxe-marquee-content .m-item{
  font-family: var(--sans);
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-weight: 500;
  padding: 0 16px;
  color: #ffffff;
}
.luxe-marquee-content .m-sep{
  color: var(--brand);
  display: inline-flex;
  align-items: center;
  opacity: 0.9;
}
@keyframes luxeMarqueeAnim{
  0%{ transform: translate3d(0, 0, 0); }
  100%{ transform: translate3d(-50%, 0, 0); }
}

/* 5. Section Ivory Center — Modern Luxury Cards */
.section-shop-by-type{
  padding: 68px 0 76px;
}
.luxe-types-grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
/* Dynamic Luxe Category Slider */
.luxe-cat-slider-container {
  position: relative;
  margin-top: 48px;
  padding: 0 4px;
}
.luxe-cat-slider-track {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding: 10px 4px 24px;
}
.luxe-cat-slider-track::-webkit-scrollbar {
  display: none;
}
.luxe-cat-slide {
  flex: 0 0 calc((100% - (3 * 24px)) / 4);
  scroll-snap-align: start;
}
@media (max-width: 1100px) {
  .luxe-cat-slide {
    flex: 0 0 calc((100% - (2 * 20px)) / 3);
  }
}
@media (max-width: 768px) {
  .luxe-cat-slide {
    flex: 0 0 calc((100% - 16px) / 2);
  }
}
@media (max-width: 480px) {
  .luxe-cat-slide {
    flex: 0 0 82%;
  }
}
.luxe-slider-nav-btn {
  position: absolute;
  top: 45%;
  transform: translateY(-50%);
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: #ffffff;
  border: 1px solid rgba(107, 58, 30, 0.22);
  color: #1C140E;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 5;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
  transition: all 0.25s ease;
}
.luxe-slider-nav-btn:hover {
  background: #1C140E;
  color: #ffffff;
  border-color: #1C140E;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
  transform: translateY(-50%) scale(1.06);
}
.luxe-slider-nav-btn.prev {
  left: -22px;
}
.luxe-slider-nav-btn.next {
  right: -22px;
}
@media (max-width: 1100px) {
  .luxe-slider-nav-btn.prev {
    left: -8px;
  }
  .luxe-slider-nav-btn.next {
    right: -8px;
  }
}
@media (max-width: 768px) {
  .luxe-slider-nav-btn {
    display: flex;
    width: 38px;
    height: 38px;
    top: 36%;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(212, 175, 55, 0.45);
    color: #1C140E;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.16);
    z-index: 10;
  }
  .luxe-slider-nav-btn svg {
    width: 18px;
    height: 18px;
  }
  .luxe-slider-nav-btn.prev {
    left: 4px;
  }
  .luxe-slider-nav-btn.next {
    right: 4px;
  }
  .luxe-slider-nav-btn:active {
    background: #1C140E;
    color: #ffffff;
    border-color: #1C140E;
    transform: translateY(-50%) scale(0.95);
  }
}
.luxe-type-card{
  background: #ffffff !important;
  border: 1px solid #EAE5DC !important;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
  display: flex;
  flex-direction: column;
  text-decoration: none !important;
  color: inherit !important;
  position: relative;
}
.luxe-type-card,
.luxe-type-card:hover,
.luxe-type-card:focus,
.luxe-type-card *,
.luxe-type-card:hover *{
  text-decoration: none !important;
}
.luxe-type-card:hover{
  transform: translateY(-6px) !important;
  box-shadow: 0 16px 36px rgba(107, 58, 30, 0.12) !important;
  border-color: rgba(107, 58, 30, 0.45) !important;
}
.luxe-type-img-wrap{
  position: relative;
  aspect-ratio: 1 / 1;
  background: #FAF8F5;
  overflow: hidden;
  display: block;
  padding: 0 !important;
  border-bottom: 1px solid rgba(230, 225, 216, 0.6);
}
.luxe-type-img-wrap img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.55s cubic-bezier(0.16, 1, 0.3, 1) !important;
  display: block !important;
}
.luxe-type-card:hover .luxe-type-img-wrap img{
  transform: scale(1.04);
}
.luxe-type-badge{
  position: absolute;
  top: 14px;
  left: 14px;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: var(--brand);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 4px 12px;
  border-radius: 20px;
  border: 1px solid rgba(107, 58, 30, 0.18);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  z-index: 2;
}
.luxe-type-body{
  padding: 22px 20px 24px;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background: #ffffff;
}
.luxe-type-spec{
  font-size: 11.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #8C7769;
  font-weight: 600;
  margin-bottom: 6px;
  display: block;
  line-height: 1.4;
}
.luxe-type-body h3,
.luxe-type-title{
  font-family: var(--serif) !important;
  font-size: 1.35rem !important;
  font-weight: 600 !important;
  margin: 0 0 16px !important;
  color: #1C140E !important;
  line-height: 1.3 !important;
  transition: color 0.25s ease;
  text-decoration: none !important;
}
.luxe-type-card:hover .luxe-type-title,
.luxe-type-card:hover h3{
  color: var(--brand) !important;
}
.luxe-type-cta{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--brand) !important;
  margin-top: auto;
  padding: 0 !important;
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  text-decoration: none !important;
  transition: gap 0.25s ease, color 0.25s ease;
}
.luxe-type-card:hover .luxe-type-cta{
  gap: 12px;
  color: #4A2814 !important;
  border-bottom: none !important;
  text-decoration: none !important;
}
.luxe-type-cta svg{
  transition: transform 0.25s ease;
  stroke-width: 2.2;
}
.luxe-type-card:hover .luxe-type-cta svg{
  transform: translateX(4px);
}
@media(max-width: 980px){
  .luxe-types-grid{
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
  }
}
@media(max-width: 580px){
  .luxe-types-grid{
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .luxe-type-body{
    padding: 20px 18px;
  }
}

/* Trust Pillars in Ivory Section */
.trust-cards-grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-top: 44px;
}
.trust-card{
  background: #ffffff;
  border: 1px solid #e5e0da;
  border-radius: 4px;
  padding: 32px 24px;
  text-align: center;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.03);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.trust-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.06);
}
.trust-icon-box{
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: #faf8f5;
  border: 1px solid #ded7ce;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--brand);
  margin-bottom: 18px;
}
.trust-card h3{
  font-size: 1.15rem;
  margin: 0 0 8px;
  font-family: var(--serif);
  font-weight: 600;
}
.trust-card p{
  font-size: 14px;
  color: #666;
  line-height: 1.55;
  margin: 0;
}

@media (max-width: 900px){
  .trust-cards-grid{
    grid-template-columns: 1fr 1fr;
    gap: 16px;
  }
}
@media (max-width: 500px){
  .trust-cards-grid{
    grid-template-columns: 1fr;
  }
}

/* 6. Checkout Progress Bar */
.checkout-steps-bar{
  background: #ffffff;
  border-bottom: 1px solid var(--line);
  padding: 16px 0;
}
.checkout-steps-list{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.step-item{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #888;
}
.step-item.active{
  color: var(--brand);
}
.step-num{
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #f0ece6;
  color: #666;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
}
.step-item.active .step-num{
  background: var(--brand);
  color: #fff;
}
.step-sep{
  color: #bbb;
  display: inline-flex;
}
.step-short{
  display: none;
}
@media (max-width: 640px) {
  .checkout-steps-bar{
    padding: 12px 0;
  }
  .checkout-steps-list{
    gap: 8px;
    font-size: 11.5px;
    letter-spacing: 0.03em;
    padding: 0 10px;
    justify-content: space-between;
  }
  .step-full{
    display: none;
  }
  .step-short{
    display: inline;
  }
  .step-num{
    width: 20px;
    height: 20px;
    font-size: 11px;
  }
  .step-sep svg{
    width: 10px;
    height: 10px;
  }
}

/* 7. Cart Page 2-Column Layout with Sticky Sidebar */
.woocommerce-cart .woocommerce{
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(360px, 420px);
  column-gap: 40px;
  row-gap: 24px;
  align-items: start;
}
.woocommerce-cart .woocommerce-notices-wrapper{
  grid-column: 1 / -1;
}
.woocommerce-cart .woocommerce-cart-form{
  grid-column: 1;
  margin-bottom: 0;
}
.woocommerce-cart .cart-collaterals{
  grid-column: 2;
  margin-top: 0;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: sticky;
  top: 96px;
  width: 100%;
}
.woocommerce-cart .cart-collaterals .cart_totals{
  width: 100%;
  max-width: 100%;
  margin: 0;
}
@media (max-width: 960px){
  .woocommerce-cart .woocommerce{
    display: block;
  }
  .woocommerce-cart .cart-collaterals{
    position: static;
    margin-top: 32px;
  }
}

/* Cart Sidebar Widgets */
.cart-sidebar-widgets{
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.cart-trust-card{
  background: #faf8f5;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 22px 20px;
}
.cart-widget-title{
  font-family: var(--serif);
  font-size: 1.15rem;
  margin: 0 0 16px;
  padding-bottom: 8px;
  border-bottom: 1px solid #eee7df;
}
.cart-trust-list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.cart-trust-list li{
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 13.5px;
}
.cart-trust-list li svg{
  color: var(--brand);
  flex-shrink: 0;
  margin-top: 2px;
}
.cart-trust-list li strong{
  display: block;
  color: var(--ink);
  font-size: 13.5px;
  margin-bottom: 2px;
}
.cart-trust-list li p{
  margin: 0;
  font-size: 12.5px;
  color: #666;
  line-height: 1.4;
}

/* Cart WhatsApp Wholesale Box */
.cart-whatsapp-card{
  background: #ffffff;
  border: 1px solid #d5cfc7;
  border-left: 4px solid #25D366;
  border-radius: var(--radius-md, 12px) !important;
  padding: 18px 20px;
  display: flex;
  gap: 14px;
  align-items: flex-start;
}
.cart-wa-icon-wrap{
  color: #25D366;
  flex-shrink: 0;
  margin-top: 2px;
}
.cart-whatsapp-card h4{
  font-size: 14px;
  margin: 0 0 6px;
  font-weight: 600;
}
.cart-whatsapp-card p{
  font-size: 12.5px;
  color: #666;
  margin: 0 0 10px;
  line-height: 1.45;
}
.btn-wa-link{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #25D366;
  color: #fff !important;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .06em;
  padding: 6px 14px;
  border-radius: var(--radius-sm, 8px) !important;
  text-decoration: none;
  transition: opacity 0.2s ease;
}
.btn-wa-link:hover{
  opacity: 0.9;
}

/* Feature pills below Cart and Checkout */
.cart-feature-pill{
  display: flex;
  align-items: flex-start;
  gap: 16px;
  background: #faf8f5;
  border: 1px solid var(--line);
  padding: 20px 22px;
  border-radius: var(--radius-md, 12px) !important;
}
.cart-feature-pill .feature-icon{
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #ffffff;
  border: 1px solid var(--line);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--brand);
  flex-shrink: 0;
}
.cart-feature-pill h4{
  font-size: 15px;
  margin: 0 0 4px;
  font-weight: 600;
}
.cart-feature-pill p{
  font-size: 13.5px;
  color: #666;
  margin: 0;
  line-height: 1.45;
}

/* 8. Spacing & Whitespace Optimization */
.page-head{
  padding: 40px 0 32px !important;
}
.page-head h1{
  font-size: 2.3rem !important;
  margin-bottom: 8px !important;
}
.page-head .lead{
  font-size: 15.5px !important;
  max-width: 680px;
  margin: 0 auto;
}
.section{
  padding: 56px 0 !important;
}
@media (max-width: 768px){
  .section{
    padding: 40px 0 !important;
  }
  .page-head{
    padding: 30px 0 24px !important;
  }
}

/* 9. Core Web Vitals & PageSpeed 100 Score Optimizations */
img{
  content-visibility: auto;
}
.card-img, .luxe-type-img-wrap, .split-img{
  contain: layout paint;
}

/* ============ VIERAHAIR — Luxury Lead Generation Ads Modal ============ */
.vh-ads-modal-wrap {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.35s ease;
  pointer-events: none;
}
.vh-ads-modal-wrap.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.vh-ads-modal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(10, 10, 10, 0.78);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  cursor: pointer;
}
.vh-ads-modal-container {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 760px;
  max-height: 92vh;
  background: #ffffff;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 25px 60px -12px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.15);
  transform: translateY(28px) scale(0.96);
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  display: flex;
  flex-direction: column;
}
.vh-ads-modal-wrap.is-visible .vh-ads-modal-container {
  transform: translateY(0) scale(1);
}
.vh-ads-modal-close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 10;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: rgba(17, 17, 17, 0.65);
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  transition: transform 0.2s, background 0.2s, color 0.2s;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.vh-ads-modal-close:hover {
  background: #ffffff;
  color: #111111;
  transform: rotate(90deg) scale(1.08);
}
.vh-ads-modal-grid {
  display: grid;
  grid-template-columns: 45% 55%;
  width: 100%;
  min-height: 440px;
  overflow-y: auto;
  max-height: 92vh;
}
.vh-ads-modal-media {
  position: relative;
  background: #111111;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.vh-ads-modal-picture {
  display: block;
  width: 100%;
  height: 100%;
}
.vh-ads-modal-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.vh-ads-media-badge {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 3;
  background: rgba(17, 17, 17, 0.85);
  backdrop-filter: blur(8px);
  color: #E5A93C;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 4px 12px;
  border-radius: 20px;
  border: 1px solid rgba(229, 169, 60, 0.35);
}
.vh-ads-modal-form-wrap {
  padding: 26px 28px 24px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #ffffff;
  color: #111111;
}
.vh-ads-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #6B3A1E;
  background: #fbf5f1;
  padding: 3px 10px;
  border-radius: 12px;
  border: 1px solid rgba(107, 58, 30, 0.15);
  margin-bottom: 8px;
}
.vh-ads-title {
  font-family: var(--serif);
  font-size: 21px;
  font-weight: 600;
  color: #111111;
  line-height: 1.25;
  margin: 0 0 5px;
}
.vh-ads-subtitle {
  font-size: 13.5px;
  color: #555555;
  line-height: 1.45;
  margin: 0 0 14px;
}
.vh-ads-highlights {
  list-style: none;
  padding: 0;
  margin: 0 0 12px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.vh-ads-highlights li {
  font-size: 13px;
  color: #2b2b2b;
  display: flex;
  align-items: center;
  gap: 8px;
  line-height: 1.35;
}
.vh-icon-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #eef7f0;
  color: #25883d;
  font-weight: bold;
  font-size: 11px;
  flex-shrink: 0;
}
.vh-ads-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.vh-form-row-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.vh-form-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.vh-form-group label {
  font-size: 12.5px;
  font-weight: 600;
  color: #333333;
}
.vh-form-group label .required {
  color: #d63638;
}
.vh-label-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.vh-same-phone-label {
  font-size: 11.5px !important;
  color: #6B3A1E !important;
  font-weight: 500 !important;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.vh-input-icon-wrap {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}
.vh-ads-form .vh-input-icon,
.vh-input-icon {
  position: absolute !important;
  left: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: #777777 !important;
  pointer-events: none !important;
  flex-shrink: 0 !important;
  z-index: 3 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 16px !important;
  height: 16px !important;
}
.vh-ads-form .vh-input-icon svg,
.vh-input-icon svg {
  width: 15px !important;
  height: 15px !important;
  display: block !important;
}
.vh-icon-wa {
  color: #25D366 !important;
}
.vh-ads-form input.vh-input[type="text"],
.vh-ads-form input.vh-input[type="tel"],
.vh-ads-form input.vh-input[type="email"],
.vh-input {
  width: 100% !important;
  height: 42px !important;
  background: #fbfbfb !important;
  border: 1px solid #dcdcdc !important;
  border-radius: 7px !important;
  padding: 6px 14px 6px 42px !important;
  font-size: 14px !important;
  color: #111111 !important;
  transition: border-color 0.2s, box-shadow 0.2s, background-color 0.2s !important;
  outline: none !important;
  box-sizing: border-box !important;
}
.vh-ads-form input.vh-input:focus,
.vh-input:focus {
  background: #ffffff !important;
  border-color: #6B3A1E !important;
  box-shadow: 0 0 0 3px rgba(107, 58, 30, 0.12) !important;
}
.vh-ads-submit-btn {
  background: linear-gradient(135deg, #6B3A1E 0%, #8E4E28 100%);
  color: #ffffff;
  border: none;
  border-radius: 7px;
  min-height: 44px;
  padding: 10px 20px;
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(107, 58, 30, 0.3);
  transition: transform 0.2s, box-shadow 0.2s, filter 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 2px;
}
.vh-ads-submit-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(107, 58, 30, 0.45);
  filter: brightness(1.08);
}
.vh-ads-submit-btn:active {
  transform: translateY(0);
}
.vh-spin-icon {
  animation: vhRotate 1s linear infinite;
  display: inline-block;
  vertical-align: middle;
}
@keyframes vhRotate {
  100% { transform: rotate(360deg); }
}
.vh-ads-security-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 11px;
  color: #888888;
  margin-top: 4px;
}
.vh-form-alert {
  padding: 8px 12px;
  border-radius: 6px;
  font-size: 12.5px;
  font-weight: 500;
}
.vh-form-alert.alert-error {
  background: #fde8e8;
  color: #c81e1e;
  border: 1px solid #f8b4b4;
}
.vh-ads-success-box {
  text-align: center;
  padding: 24px 10px;
}
.vh-success-check-circle {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #eef7f0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 14px;
  box-shadow: 0 0 0 6px rgba(37, 211, 102, 0.12);
}
.vh-success-title {
  font-size: 20px;
  font-weight: 700;
  color: #111111;
  margin: 0 0 8px;
}
.vh-success-desc {
  font-size: 14px;
  color: #555555;
  line-height: 1.55;
  max-width: 400px;
  margin: 0 auto 20px;
}
.vh-success-wa-btn {
  background: #25D366;
  color: #ffffff;
  border-radius: 7px;
  padding: 11px 22px;
  font-size: 14.5px;
  font-weight: 700;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 4px 14px rgba(37, 211, 102, 0.35);
  transition: transform 0.2s, box-shadow 0.2s;
}
.vh-success-wa-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.45);
  color: #ffffff;
}
.vh-success-close-btn {
  display: block;
  margin: 14px auto 0;
  background: none;
  border: none;
  color: #777777;
  font-size: 12.5px;
  cursor: pointer;
  text-decoration: underline;
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
  .vh-ads-modal-wrap {
    padding: 12px;
    align-items: flex-end;
  }
  .vh-ads-modal-container {
    max-height: 94vh;
    border-radius: 16px 16px 10px 10px;
  }
  .vh-ads-modal-grid {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .vh-ads-modal-media {
    height: 200px;
    width: 100%;
  }
  .vh-ads-modal-picture {
    display: block;
    width: 100%;
    height: 100%;
  }
  .vh-ads-modal-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
  }
  .vh-ads-modal-form-wrap {
    padding: 20px 18px 22px;
  }
  .vh-ads-title {
    font-size: 19px;
  }
  .vh-ads-subtitle {
    font-size: 13px;
    margin-bottom: 12px;
  }
  .vh-form-row-2 {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .vh-input {
    font-size: 16px !important;
    height: 46px;
  }
  .vh-ads-submit-btn {
    min-height: 48px;
    font-size: 14px;
  }
}

/* ========================================================
 * Section Why VIERAHAIR — The Atelier Standard (Luxury Redesign)
 * ======================================================== */
.section-why-luxury {
  position: relative;
  background: radial-gradient(circle at 18% 25%, rgba(212, 175, 55, 0.08) 0%, transparent 48%),
              radial-gradient(circle at 82% 75%, rgba(197, 155, 39, 0.06) 0%, transparent 52%),
              linear-gradient(180deg, #0D0A08 0%, #15100C 50%, #0D0A08 100%);
  color: #FAF8F5;
  padding: 100px 0;
  border-top: 1px solid rgba(212, 175, 55, 0.2);
  border-bottom: 1px solid rgba(212, 175, 55, 0.2);
  overflow: hidden;
}

.vh-why-ambient-glow {
  position: absolute;
  pointer-events: none;
  border-radius: 50%;
  filter: blur(80px);
  z-index: 1;
}
.vh-why-glow-1 {
  width: 460px;
  height: 460px;
  top: -120px;
  left: -100px;
  background: radial-gradient(circle, rgba(212, 175, 55, 0.12) 0%, transparent 70%);
}
.vh-why-glow-2 {
  width: 480px;
  height: 480px;
  bottom: -140px;
  right: -80px;
  background: radial-gradient(circle, rgba(232, 200, 130, 0.09) 0%, transparent 70%);
}

.section-why-luxury .wrap {
  position: relative;
  z-index: 2;
}

.vh-why-grid {
  display: grid;
  grid-template-columns: 1.05fr 1.35fr;
  gap: 56px;
  align-items: center;
}

/* --- Left Column --- */
.vh-why-col-left {
  display: flex;
  flex-direction: column;
}

.vh-why-eyebrow {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 16px;
}

.vh-why-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(212, 175, 55, 0.15) 0%, rgba(212, 175, 55, 0.05) 100%);
  border: 1px solid rgba(212, 175, 55, 0.35);
  font-family: var(--serif);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  color: #E8C882;
  text-transform: uppercase;
}

.vh-why-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #E8C882;
  box-shadow: 0 0 8px #E8C882;
  display: inline-block;
}

.vh-why-tagline {
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #A69B8E;
  font-weight: 500;
}

.section-why-luxury h2.vh-why-heading,
.vh-why-heading {
  font-family: var(--serif) !important;
  font-size: 2.75rem !important;
  line-height: 1.2 !important;
  font-weight: 500 !important;
  color: #FAF8F5 !important;
  margin: 0 0 18px !important;
  letter-spacing: -0.01em !important;
}

.vh-why-gold-divider {
  width: 64px;
  height: 2px;
  background: linear-gradient(90deg, #D4AF37 0%, rgba(212, 175, 55, 0) 100%);
  margin-bottom: 22px;
}

.vh-why-lead {
  font-size: 16px;
  line-height: 1.75;
  color: #C9BFB5;
  margin: 0 0 28px;
  font-weight: 400;
}

/* Hallmarks */
.vh-why-hallmarks {
  list-style: none;
  padding: 0;
  margin: 0 0 36px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.vh-why-hallmarks li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 15px;
  line-height: 1.55;
  color: #DDD6CE;
}

.vh-why-hallmarks li strong {
  color: #FFFFFF;
  font-weight: 600;
}

.vh-hallmark-check {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(212, 175, 55, 0.16);
  border: 1px solid rgba(212, 175, 55, 0.35);
  color: #E8C882;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
}

/* Actions & Trust Note */
.vh-why-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
}

.vh-why-btn-gold {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 15px 30px;
  border-radius: 30px;
  background: linear-gradient(135deg, #F5DEB3 0%, #D4AF37 50%, #AA8022 100%);
  color: #1A130C !important;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(212, 175, 55, 0.28), 0 2px 4px rgba(0, 0, 0, 0.3);
  transition: all 0.35s ease;
  overflow: hidden;
}

.vh-why-btn-gold::before {
  content: '';
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
  transform: skewX(-25deg);
  transition: left 0.75s ease;
}

.vh-why-btn-gold:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(212, 175, 55, 0.42), 0 4px 10px rgba(0, 0, 0, 0.4);
  color: #110B06 !important;
}

.vh-why-btn-gold:hover::before {
  left: 125%;
}

.vh-why-trust-note {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #B8ADA0;
  font-weight: 500;
}

.vh-why-pulse-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #25D366;
  box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
  animation: vhPulseGlow 2s infinite;
}

@keyframes vhPulseGlow {
  0% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
  }
  70% {
    box-shadow: 0 0 0 8px rgba(37, 211, 102, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0);
  }
}

/* --- Right Column: Luxury Cards Grid --- */
.vh-why-cards-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 22px;
}

.vh-why-card {
  position: relative;
  background: linear-gradient(145deg, rgba(30, 23, 17, 0.72) 0%, rgba(16, 12, 9, 0.92) 100%);
  border: 1px solid rgba(212, 175, 55, 0.22);
  border-radius: 12px;
  padding: 28px 24px 26px;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
              border-color 0.35s ease,
              box-shadow 0.35s ease,
              background 0.35s ease;
  display: flex;
  flex-direction: column;
}

.vh-why-card:hover {
  transform: translateY(-5px);
  border-color: rgba(232, 200, 130, 0.55);
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.55), 0 0 24px rgba(212, 175, 55, 0.16);
  background: linear-gradient(145deg, rgba(38, 29, 21, 0.85) 0%, rgba(20, 15, 11, 0.95) 100%);
}

.vh-why-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
}

.vh-why-icon-box {
  width: 48px;
  height: 48px;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(232, 200, 130, 0.14) 0%, rgba(212, 175, 55, 0.04) 100%);
  border: 1px solid rgba(212, 175, 55, 0.32);
  color: #E8C882;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

.vh-why-card:hover .vh-why-icon-box {
  background: rgba(212, 175, 55, 0.22);
  border-color: #E8C882;
  color: #FFF3DA;
  box-shadow: 0 0 14px rgba(212, 175, 55, 0.3);
}

.vh-why-num {
  font-family: var(--serif);
  font-size: 1.55rem;
  font-weight: 700;
  color: #D4AF37;
  opacity: 0.65;
  letter-spacing: 0.05em;
  transition: opacity 0.3s ease, color 0.3s ease;
}

.vh-why-card:hover .vh-why-num {
  opacity: 1;
  color: #FFF2D1;
  text-shadow: 0 0 12px rgba(232, 200, 130, 0.4);
}

.vh-why-card-title {
  font-family: var(--serif);
  font-size: 1.18rem;
  font-weight: 600;
  color: #FFFFFF;
  margin: 0 0 10px;
  letter-spacing: 0.01em;
  line-height: 1.35;
}

.vh-why-card-desc {
  font-size: 0.93rem;
  line-height: 1.65;
  color: #BBB0A4;
  margin: 0 0 18px;
  flex-grow: 1;
}

.vh-why-card-pill {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 12px;
  border-radius: 20px;
  background: rgba(212, 175, 55, 0.08);
  border: 1px solid rgba(212, 175, 55, 0.22);
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #E8C882;
  transition: all 0.3s ease;
}

.vh-why-card:hover .vh-why-card-pill {
  background: rgba(212, 175, 55, 0.16);
  border-color: rgba(212, 175, 55, 0.45);
  color: #FFF4D9;
}

.vh-card-pill-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #D4AF37;
  box-shadow: 0 0 6px #E8C882;
}

/* Responsive */
@media (max-width: 1024px) {
  .vh-why-grid {
    grid-template-columns: 1fr;
    gap: 44px;
  }
  .vh-why-col-left {
    text-align: left;
  }
  .vh-why-heading {
    font-size: 2.25rem;
  }
}

@media (max-width: 640px) {
  .section-why-luxury {
    padding: 60px 0;
  }
  .vh-why-heading {
    font-size: 1.85rem;
  }
  .vh-why-cards-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .vh-why-card {
    padding: 22px 20px;
  }
  .vh-why-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .vh-why-btn-gold {
    justify-content: center;
    width: 100%;
    text-align: center;
  }
  .vh-why-trust-note {
    justify-content: center;
  }
}

/* ============ VIERAHAIR — Section: Sales Team (Nhân viên Sales) ============ */
.section-sales-team {
  padding: 68px 0;
  background: #FAF8F5;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.vh-staff-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 22px 18px;
  margin-top: 44px;
}
.vh-staff-card {
  background: #FFFFFF;
  border: 1px solid #ECE7E0;
  border-radius: 12px;
  padding: 24px 14px 20px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
  position: relative;
}
.vh-staff-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 32px rgba(107, 58, 30, 0.12);
  border-color: #D4AF37;
}
.vh-staff-avatar-wrap {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  position: relative;
  margin-bottom: 14px;
  padding: 3px;
  background: linear-gradient(135deg, #D4AF37 0%, #FAF8F5 50%, #B38E32 100%);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}
.vh-staff-avatar {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  background: #FAF8F5;
  transition: transform 0.3s ease;
}
.vh-staff-card:hover .vh-staff-avatar {
  transform: scale(1.05);
}
.vh-staff-online-dot {
  position: absolute;
  bottom: 2px;
  right: 6px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #25D366;
  border: 2px solid #FFFFFF;
  box-shadow: 0 0 0 2px rgba(37, 211, 102, 0.3);
}
.vh-staff-name {
  font-family: var(--serif);
  font-size: 1.1rem;
  font-weight: 600;
  color: #1C140E;
  margin: 0 0 4px;
  line-height: 1.3;
}
.vh-staff-role {
  font-size: 0.8rem;
  color: #7A7269;
  margin: 0 0 14px;
  font-weight: 500;
  line-height: 1.4;
  flex-grow: 1;
}
.vh-staff-actions {
  display: flex;
  gap: 8px;
  justify-content: center;
  align-items: center;
  margin-top: auto;
}
.vh-staff-btn {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: all 0.22s ease;
  border: 1px solid transparent;
}
.vh-staff-btn.phone {
  background: #F4EFEA;
  color: #1C140E;
}
.vh-staff-btn.phone:hover {
  background: #1C140E;
  color: #FFFFFF;
  transform: translateY(-2px);
}
.vh-staff-btn.whatsapp {
  background: #EAF8EF;
  color: #25D366;
}
.vh-staff-btn.whatsapp:hover {
  background: #25D366;
  color: #FFFFFF;
  transform: translateY(-2px);
}
.vh-staff-btn.instagram {
  background: #FDF1F3;
  color: #E1306C;
}
.vh-staff-btn.instagram:hover {
  background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
  color: #FFFFFF;
  transform: translateY(-2px);
}

@media (max-width: 1100px) {
  .vh-staff-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (max-width: 860px) {
  .vh-staff-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 580px) {
  .section-sales-team {
    padding: 48px 0;
  }
  .vh-staff-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px 10px;
  }
  .vh-staff-card {
    padding: 16px 8px 14px;
  }
  .vh-staff-avatar-wrap {
    width: 74px;
    height: 74px;
  }
  .vh-staff-name {
    font-size: 0.96rem;
  }
  .vh-staff-role {
    font-size: 0.74rem;
    margin-bottom: 10px;
  }
  .vh-staff-btn {
    width: 32px;
    height: 32px;
  }
}

/* ============ VIERAHAIR — Section: Latest Blog Posts (Bài viết mới) ============ */
.section-latest-posts {
  padding: 68px 0;
  background: #FFFFFF;
}
.vh-blog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-top: 44px;
  text-align: center;
  justify-content: center;
}
.vh-blog-card {
  background: #FFFFFF;
  border: 1px solid #ECE7E1;
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
  text-align: center;
}
.vh-blog-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.08);
  border-color: #D4AF37;
}
.vh-blog-img-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  display: block;
  background: #FAF8F5;
}
.vh-blog-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
  display: block;
}
.vh-blog-card:hover .vh-blog-img-wrap img {
  transform: scale(1.05);
}
.vh-blog-cat {
  position: absolute;
  top: 14px;
  left: 14px;
  background: rgba(28, 20, 14, 0.82);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  color: #FFFFFF;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 4px 11px;
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  z-index: 2;
}
.vh-blog-body {
  padding: 24px 22px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  flex-grow: 1;
}
.vh-blog-meta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 12.5px;
  color: #888;
  margin-bottom: 10px;
}
.vh-blog-dot {
  color: #CCC;
}
.vh-blog-title {
  font-family: var(--serif);
  font-size: 1.18rem;
  font-weight: 600;
  line-height: 1.38;
  margin: 0 0 10px;
  color: #1C140E;
  text-align: center;
}
.vh-blog-title a {
  color: #1C140E;
  text-decoration: none;
  transition: color 0.2s ease;
}
.vh-blog-title a:hover {
  color: var(--brand);
}
.vh-blog-excerpt {
  font-size: 0.92rem;
  line-height: 1.65;
  color: #666;
  margin: 0 0 18px;
  flex-grow: 1;
  text-align: center;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.vh-blog-readmore {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--brand);
  text-decoration: none;
  transition: all 0.2s ease;
}
.vh-blog-readmore:hover {
  gap: 10px;
  color: #1C140E;
}

@media (max-width: 960px) {
  .section-latest-posts {
    padding: 48px 0;
  }
  .vh-blog-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 22px;
  }
}
@media (max-width: 600px) {
  .section-latest-posts {
    padding: 38px 0;
  }
  .vh-blog-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

/* ============ VIERAHAIR — Floating Contact Bar & Sales Modal ============ */
.vh-floating-contact-bar {
  position: fixed;
  right: 22px;
  bottom: 84px;
  z-index: 995;
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
}
.vh-float-btn {
  position: relative;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
  outline: none;
}
.vh-float-btn:hover {
  transform: translateY(-3px) scale(1.06);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
}
.vh-btn-sales {
  background: linear-gradient(135deg, #D4AF37 0%, #B88928 100%);
  color: #FFFFFF;
  border: 1.5px solid rgba(255, 255, 255, 0.35);
  animation: vhSalesPulse 2.8s infinite;
}
@keyframes vhSalesPulse {
  0% { box-shadow: 0 0 0 0 rgba(212, 175, 55, 0.6), 0 8px 24px rgba(0, 0, 0, 0.18); }
  70% { box-shadow: 0 0 0 12px rgba(212, 175, 55, 0), 0 8px 24px rgba(0, 0, 0, 0.18); }
  100% { box-shadow: 0 0 0 0 rgba(212, 175, 55, 0), 0 8px 24px rgba(0, 0, 0, 0.18); }
}
.vh-btn-wa {
  background: #25D366;
  color: #FFFFFF;
}
.vh-btn-phone {
  background: #1C140E;
  color: #FFFFFF;
  border: 1px solid rgba(212, 175, 55, 0.3);
}
.vh-float-btn-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.vh-float-live-badge {
  position: absolute;
  top: 2px;
  right: 2px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #25D366;
  border: 2px solid #FFFFFF;
  box-shadow: 0 0 6px rgba(37, 211, 102, 0.7);
}
.vh-float-tooltip {
  position: absolute;
  right: calc(100% + 12px);
  top: 50%;
  transform: translateY(-50%) translateX(6px);
  background: #1C140E;
  color: #FFFFFF;
  font-family: var(--sans);
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.04em;
  padding: 6px 12px;
  border-radius: 6px;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: all 0.2s ease;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
  border: 1px solid rgba(212, 175, 55, 0.3);
}
.vh-float-tooltip::after {
  content: '';
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent transparent #1C140E;
}
.vh-float-btn:hover .vh-float-tooltip {
  opacity: 1;
  visibility: visible;
  transform: translateY(-50%) translateX(0);
}

/* Sales Staff Lightbox Modal / Drawer */
.vh-sales-modal-wrap {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.vh-sales-modal-wrap.is-active {
  opacity: 1;
  visibility: visible;
}
.vh-sales-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(17, 14, 12, 0.65);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}
.vh-sales-modal-container {
  position: relative;
  z-index: 2;
  width: 92%;
  max-width: 460px;
  max-height: 85vh;
  background: #FFFFFF;
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(212, 175, 55, 0.3);
  transform: translateY(20px) scale(0.97);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.vh-sales-modal-wrap.is-active .vh-sales-modal-container {
  transform: translateY(0) scale(1);
}
.vh-sales-modal-header {
  background: linear-gradient(135deg, #1C140E 0%, #2A1D15 100%);
  color: #FFFFFF;
  padding: 22px 24px;
  position: relative;
  border-bottom: 2px solid #D4AF37;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.vh-sales-modal-header-text {
  padding-right: 28px;
}
.vh-sales-modal-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #E8C882;
  margin-bottom: 4px;
}
.vh-sales-modal-title {
  font-family: var(--serif);
  font-size: 1.35rem;
  font-weight: 600;
  color: #FFFFFF;
  margin: 0 0 6px;
  line-height: 1.25;
}
.vh-sales-modal-sub {
  font-size: 12.5px;
  line-height: 1.5;
  color: #BBB0A4;
  margin: 0;
}
.vh-sales-modal-close {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #FFFFFF;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  flex-shrink: 0;
}
.vh-sales-modal-close:hover {
  background: #A62828;
  border-color: #A62828;
  transform: rotate(90deg);
}
.vh-sales-modal-body {
  padding: 16px 20px;
  overflow-y: auto;
  max-height: calc(85vh - 160px);
  -webkit-overflow-scrolling: touch;
}
.vh-sales-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.vh-sales-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #FAF8F5;
  border: 1px solid #ECE7E1;
  transition: all 0.25s ease;
}
.vh-sales-item:hover {
  background: #FFFFFF;
  border-color: #D4AF37;
  box-shadow: 0 4px 16px rgba(107, 58, 30, 0.08);
  transform: translateX(2px);
}
.vh-sales-item-avatar-wrap {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  position: relative;
  flex-shrink: 0;
  border: 1.5px solid #D4AF37;
  padding: 1px;
}
.vh-sales-item-avatar {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}
.vh-sales-item-dot {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #25D366;
  border: 1.5px solid #FFFFFF;
}
.vh-sales-item-info {
  flex-grow: 1;
  min-width: 0;
}
.vh-sales-item-name {
  font-family: var(--serif);
  font-size: 0.98rem;
  font-weight: 600;
  color: #1C140E;
  margin-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.vh-sales-item-role {
  font-size: 0.76rem;
  color: #7A7269;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.vh-sales-item-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.vh-sales-act-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  height: 30px;
  padding: 0 10px;
  border-radius: 15px;
  text-decoration: none;
  font-size: 11px;
  font-weight: 600;
  transition: all 0.2s ease;
}
.vh-sales-act-btn.wa {
  background: #25D366;
  color: #FFFFFF;
}
.vh-sales-act-btn.wa:hover {
  background: #1eb855;
  transform: translateY(-1px);
}
.vh-sales-act-btn.phone {
  background: #1C140E;
  color: #FFFFFF;
  width: 30px;
  padding: 0;
  border-radius: 50%;
}
.vh-sales-act-btn.phone:hover {
  background: var(--brand);
  transform: translateY(-1px);
}
.vh-sales-act-btn.ig {
  background: #FDF1F3;
  color: #E1306C;
  width: 30px;
  padding: 0;
  border-radius: 50%;
}
.vh-sales-act-btn.ig:hover {
  background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
  color: #FFFFFF;
  transform: translateY(-1px);
}
.vh-sales-modal-footer {
  padding: 12px 20px;
  background: #FAF8F5;
  border-top: 1px solid #ECE7E1;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  color: #7A7269;
  letter-spacing: 0.02em;
}

/* Mobile drawer mode */
@media (max-width: 600px) {
  .vh-floating-contact-bar {
    right: 14px;
    bottom: 74px;
    gap: 10px;
  }
  .vh-float-btn {
    width: 46px;
    height: 46px;
  }
  .vh-float-tooltip {
    display: none; /* Hide tooltips on mobile */
  }
  .vh-sales-modal-wrap {
    align-items: flex-end;
  }
  .vh-sales-modal-container {
    width: 100%;
    max-width: 100%;
    border-radius: 20px 20px 0 0;
    max-height: 82vh;
    transform: translateY(100%);
  }
  .vh-sales-modal-wrap.is-active .vh-sales-modal-container {
    transform: translateY(0);
  }
  .vh-sales-modal-header {
    padding: 18px 18px 16px;
  }
  .vh-sales-modal-title {
    font-size: 1.2rem;
  }
  .vh-sales-modal-body {
    padding: 12px 14px;
  }
  .vh-sales-item {
    padding: 8px 10px;
  }
  .vh-sales-act-btn.wa span {
    display: none; /* Only show WhatsApp icon on small mobile */
  }
  .vh-sales-act-btn.wa {
    width: 30px;
    padding: 0;
    border-radius: 50%;
  }
}

/* ============ Announcement Bar ============ */
.announce {
  background: var(--brand);
  color: #ffffff;
  padding: 8px 0;
  font-size: 11.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 500;
  box-sizing: border-box;
}
.announce-wrap {
  display: flex;
  align-items: center;
  box-sizing: border-box;
}
.announce-inner {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  line-height: 1.4;
  color: #ffffff;
}
.announce-icon {
  display: inline-block;
  vertical-align: middle;
  stroke: #ffffff;
  opacity: 0.95;
  flex-shrink: 0;
}
.announce-text {
  display: inline-block;
}

/* Hide Hotline in Desktop Header */
.site-header .hotline {
  display: none !important;
}

/* ============ Desktop ONLY: VIERAHAIR Atelier Luxury Framed Floating Logo Badge ============ */
@media (min-width: 901px) {
  :root {
    --announce-height: 36.4px;
  }
  .announce-wrap {
    justify-content: flex-end;
  }
  .announce-inner {
    justify-content: flex-end;
  }

  .header-logo-left,
  .header-logo-center {
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
  }
  .header-logo-left {
    width: 176px;
    min-width: 176px;
    flex: 0 0 176px;
  }
  .header-logo-center {
    width: 176px;
    min-width: 176px;
    flex: 0 0 176px;
    justify-content: center;
  }

  .vh-logo-frame {
    position: absolute;
    top: calc(-1 * var(--announce-height, 36.4px));
    bottom: 0 !important;
    left: 0;
    z-index: 60;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 176px;
    min-height: 0;
    height: auto;
    background: #ffffff;
    padding: 8px 14px 14px;
    box-sizing: border-box;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-decoration: none;
    transition: top 0.28s cubic-bezier(0.16, 1, 0.3, 1), padding 0.28s ease;
  }

  /* No decorative inner frame */
  .vh-logo-frame::before {
    display: none !important;
  }

  .site-header.header-center .vh-logo-frame {
    left: 50%;
    transform: translateX(-50%);
  }

  .vh-logo-frame:hover {
    box-shadow: none !important;
  }
  .vh-logo-frame:hover .custom-logo {
    transform: translateY(-1px) scale(1.02);
  }

  .vh-logo-frame .custom-logo-link {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 0 !important;
    width: 100% !important;
    height: 100% !important;
    text-decoration: none !important;
  }

  .vh-logo-frame .custom-logo {
    max-height: 72px !important;
    max-width: 154px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), max-height 0.25s ease !important;
  }

  /* Scrolled state desktop (Header is sticky at top:0, sits cleanly above bottom border) */
  .site-header.is-scrolled .vh-logo-frame {
    top: 0 !important;
    bottom: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 6px 14px 8px;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
  }
  .site-header.is-scrolled .vh-logo-frame .custom-logo {
    max-height: 56px !important;
  }

  /* Fallback text logo inside frame */
  .vh-logo-frame .logo {
    font-family: var(--serif) !important;
    font-size: 20px !important;
    letter-spacing: .12em !important;
    line-height: 1.15 !important;
    text-align: center !important;
    color: var(--brand) !important;
    text-decoration: none !important;
  }
  .vh-logo-frame .logo small {
    display: block !important;
    font-family: var(--sans) !important;
    font-size: 8.5px !important;
    letter-spacing: .26em !important;
    color: #777 !important;
    margin-top: 3px !important;
  }
}

/* ============ Mobile (< 900px): Clean Standard Header without floating badge ============ */
@media (max-width: 900px) {
  .announce {
    padding: 7px 0 !important;
    font-size: 11px !important;
  }
  .announce-wrap {
    justify-content: center !important;
    padding: 0 16px !important;
  }
  .announce-inner {
    justify-content: center !important;
    text-align: center !important;
    gap: 6px !important;
  }
  .announce-icon {
    width: 14px !important;
    height: 14px !important;
  }

  .header-logo-left,
  .header-logo-center {
    position: static !important;
    width: auto !important;
    min-width: 0 !important;
    flex: 0 1 auto !important;
    height: auto !important;
    display: flex !important;
    align-items: center !important;
  }
  .vh-logo-frame {
    position: static !important;
    top: auto !important;
    left: auto !important;
    width: auto !important;
    min-height: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    display: flex !important;
    align-items: center !important;
  }
  .vh-logo-frame::before {
    display: none !important;
  }
  .vh-logo-frame .custom-logo-link {
    display: flex !important;
    align-items: center !important;
    line-height: 0 !important;
  }
  .vh-logo-frame .custom-logo {
    max-height: 38px !important;
    max-width: 140px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
  }
  .vh-logo-frame .logo {
    font-size: 18px !important;
  }
}

/* ============ Synchronized Luxury Border Radius System ============ */
:root {
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-full: 9999px;
}

/* 1. Synchronized Buttons & CTAs (8px) */
.btn,
.button,
a.btn,
input[type="submit"],
button[type="submit"],
.mobile-wa-btn,
.mobile-contact-pill,
.whatsapp-order-btn,
.btn-wa-link,
.single_add_to_cart_button,
.hero-cta .btn,
.vh-sales-act-btn,
.vh-blog-readmore,
.section-home-intro .btn,
.section-latest-posts .btn,
.cat-tab,
.cat-chips a,
.shop-cat-chips a,
.gallery-filter-btn,
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span,
.pagination a,
.pagination span,
.page-numbers,
.menu-dropdown-toggle {
  border-radius: var(--radius-sm, 8px) !important;
}

/* 2. Synchronized Form Controls (8px) */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="number"],
input[type="search"],
select,
textarea,
.quantity input.qty,
.vh-input,
.woocommerce .woocommerce-ordering select.orderby,
select.orderby {
  border-radius: var(--radius-sm, 8px) !important;
}

/* 3. Synchronized Cards & Content Surfaces (12px) */
.hero-card,
.vh-blog-card,
.vh-staff-card,
.cart-whatsapp-card,
.vh-sales-item,
.woocommerce ul.products li.product,
.luxe-stats-strip,
.map-wrap,
.product-trust-badges,
.cart-feature-pill,
.woocommerce-product-gallery {
  border-radius: var(--radius-md, 12px) !important;
}

/* Image wrappers inside cards */
.vh-blog-thumb,
.vh-blog-thumb img,
.vh-staff-thumb,
.vh-staff-thumb img,
.woocommerce ul.products li.product a img,
.intro-video-box,
.woocommerce div.product div.images .flex-control-thumbs li,
.woocommerce div.product div.images .flex-control-thumbs li img {
  border-radius: 8px !important;
}

/* Small Badges & Tags (4px) */
.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale,
span.onsale,
.badge-tag,
.vh-wa-img {
  border-radius: var(--radius-xs, 4px) !important;
}

/* Synchronized Notices & Alerts (8px) */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews,
.notice,
.woocommerce-product-details__short-description {
  border-radius: var(--radius-sm, 8px) !important;
}

/* 4. Synchronized Modals & Dialogs (18px) */
.vh-sales-modal-container,
.vh-ads-modal {
  border-radius: var(--radius-lg, 18px) !important;
}

/* Mobile bottom sheet drawer has top corners */
@media (max-width: 600px) {
  .vh-sales-modal-container {
    border-radius: 20px 20px 0 0 !important;
  }
}

/* 5. WhatsApp Icon Universal Rendering */
.vh-wa-img {
  display: inline-block !important;
  vertical-align: middle !important;
  object-fit: contain !important;
  flex-shrink: 0 !important;
}

/* Pure WhatsApp PNG Header Icon - Zero background, zero border, zero text */
.whatsapp-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  line-height: 0 !important;
  vertical-align: middle !important;
  text-decoration: none !important;
  cursor: pointer !important;
}
.whatsapp-btn:hover {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.whatsapp-btn span {
  display: none !important;
}
.whatsapp-btn .vh-wa-img {
  width: 34px !important;
  height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  object-fit: contain !important;
  filter: drop-shadow(0 2px 5px rgba(0, 0, 0, 0.12));
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), filter 0.25s ease !important;
}
.whatsapp-btn:hover .vh-wa-img {
  transform: scale(1.1) !important;
  filter: drop-shadow(0 4px 10px rgba(37, 211, 102, 0.45));
}
@media (max-width: 900px) {
  .whatsapp-btn {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
  }
  .whatsapp-btn .vh-wa-img {
    margin: 0 !important;
    width: 28px !important;
    height: 28px !important;
  }
}
.vh-float-btn.vh-btn-wa .vh-wa-img {
  width: 28px !important;
  height: 28px !important;
  margin: auto !important;
}
.vh-sales-act-btn.wa .vh-wa-img {
  width: 16px !important;
  height: 16px !important;
  margin-right: 3px;
}
.mobile-wa-btn .vh-wa-img {
  width: 22px !important;
  height: 22px !important;
}

/* Dropdown toggle arrow center alignment fix */
.menu-dropdown-toggle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}
.menu-dropdown-toggle svg,
.vh-menu-arrow {
  display: block !important;
  margin: auto !important;
  flex-shrink: 0 !important;
}