/** Shopify CDN: Minification failed

Line 2100:70 Unexpected "}"

**/
/* ================================================================
   Velora Bags — v5 Premium Theme
   50+ Improvements | Luxury Ecommerce for Shopify OS 2.0
   ================================================================ */

/* ---- Reset & Base -------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 14px; scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--f-body);
  color: var(--c-text);
  background: var(--c-bg);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
h1,h2,h3,h4,h5,h6 { font-family: var(--f-head); font-weight: 600; line-height: 1.15; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--c-accent); }
img { display: block; max-width: 100%; height: auto; }
ul,ol { list-style: none; }
button { cursor: pointer; font: inherit; border: none; background: none; }
input,select,textarea { font: inherit; }
.skip-to-content { position: absolute; left: -9999px; }
.skip-to-content:focus { position: static; }

/* IMPROVEMENT 1: Extended CSS token palette */
:root {
  --c-accent-light: rgba(255,107,0,.10);
  --c-accent-mid:   rgba(255,107,0,.35);
  --shadow-xs:   0 1px 4px rgba(0,0,0,.06);
  --shadow-sm:   0 2px 12px rgba(0,0,0,.07);
  --shadow-md:   0 6px 24px rgba(0,0,0,.10);
  --shadow-lg:   0 12px 48px rgba(0,0,0,.14);
  --shadow-xl:   0 24px 80px rgba(0,0,0,.18);
  --shadow-card: 0 2px 16px rgba(0,0,0,.07);
  --shadow-hover:0 8px 32px rgba(0,0,0,.13);
  --ease-out: cubic-bezier(.4,0,.2,1);
  --ease-bounce: cubic-bezier(.34,1.56,.64,1);
  --transition: all .25s cubic-bezier(.4,0,.2,1);
  --transition-fast: all .15s cubic-bezier(.4,0,.2,1);
  --r-card: 10px;
  --r-btn:  0px;
}

/* IMPROVEMENT 2: Wider layout + spacing system */
.vl-wrap    { max-width: 1480px; margin: 0 auto; padding: 0 24px; }
.vl-wrap-sm { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.vl-wrap-xs { max-width: 860px;  margin: 0 auto; padding: 0 24px; }
.vl-section    { padding: 64px 0; }
.vl-section-sm { padding: 40px 0; }
.vl-section-lg { padding: 96px 0; }

/* IMPROVEMENT 3: Shipping bar with animated gold fill */
.vl-shipping-bar {
  background: var(--c-dark);
  color: var(--c-bg2);
  padding: 9px 24px;
  font-size: 12px;
  text-align: center;
  font-weight: 500;
  letter-spacing: .4px;
  position: relative;
  overflow: hidden;
}
.vl-shipping-bar::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(201,169,110,.07), transparent);
  animation: shimmerBar 3s ease infinite;
}
@keyframes shimmerBar { 0%,100%{transform:translateX(-100%)} 60%{transform:translateX(100%)} }
.vl-shipping-bar__inner { display: flex; align-items: center; justify-content: center; gap: 14px; position: relative; }
.vl-shipping-bar__track { width: 150px; height: 3px; background: rgba(255,255,255,.15); border-radius: 2px; overflow: hidden; }
.vl-shipping-bar__fill {
  height: 100%;
  background: linear-gradient(90deg, var(--c-accent2), var(--c-accent));
  border-radius: 2px; transition: width .7s var(--ease-out);
  width: var(--progress, 0%); position: relative;
}
.vl-shipping-bar__fill::after {
  content: ''; position: absolute; right: 0; top: -1px;
  width: 6px; height: 5px; border-radius: 50%;
  background: var(--c-accent); box-shadow: 0 0 6px var(--c-accent);
}
.vl-shipping-bar__msg strong { color: var(--c-accent); }

/* IMPROVEMENT 4: Announcement bar */
.vl-announcement {
  background: linear-gradient(90deg, #CC2200, #FF6B00, #FFB800, #FF6B00, #CC2200);
  background-size: 300% 100%;
  animation: announcementSlide 6s linear infinite;
  color: #fff;
  text-align: center; padding: 9px 48px;
  font-size: 12.5px; font-weight: 700; letter-spacing: .5px;
  position: relative; text-transform: uppercase;
}
@keyframes announcementSlide {
  0% { background-position: 0% 0%; }
  100% { background-position: 300% 0%; }
}
.vl-announcement a { color: #fff; text-decoration: underline; }
.vl-announcement__close {
  position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
  width: 24px; height: 24px; display: flex; align-items: center; justify-content: center;
  cursor: pointer; opacity: .6; transition: opacity .15s; border-radius: 50%;
}
.vl-announcement__close:hover { opacity: 1; background: rgba(0,0,0,.1); }
.vl-announcement__close svg { width: 12px; height: 12px; fill: var(--c-dark); }

/* IMPROVEMENT 5: Header glassmorphism on scroll */
.vl-header {
  background: transparent;
  border-bottom: 1px solid transparent;
  position: relative;
  transition: box-shadow .35s, background .35s;
}
.vl-header.scrolled {
  background: rgba(255,255,255,.98);
  box-shadow: 0 4px 24px rgba(0,0,0,.09);
  border-bottom-color: transparent;
}
.vl-header-top {
  display: flex; align-items: center; height: 72px;
  gap: 24px; max-width: 1480px; margin: 0 auto; padding: 0 24px;
}

/* IMPROVEMENT 6: Gradient logo text */
.vl-logo {
  flex-shrink: 0; display: flex; flex-direction: column;
  align-items: flex-start; text-decoration: none; line-height: 1; gap: 3px;
}
.vl-logo img { height: 44px; width: auto; }
.vl-logo-name {
  font-family: var(--f-head); font-size: 26px; font-weight: 700;
  letter-spacing: 2px; text-transform: uppercase;
  background: linear-gradient(135deg, var(--c-dark) 0%, var(--c-accent2) 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.vl-logo-tag { font-size: 8.5px; color: var(--c-muted); letter-spacing: 3px; text-transform: uppercase; }

/* IMPROVEMENT 7: Nav with underline slide animation */
.vl-nav { display: flex; align-items: center; gap: 0; flex: 1; justify-content: center; }
.vl-nav-item { position: relative; }
.vl-nav-link {
  display: flex; align-items: center; gap: 4px;
  padding: 10px 16px; font-size: 13px; font-weight: 500;
  color: var(--c-text); letter-spacing: .5px; text-transform: uppercase;
  transition: color .2s; white-space: nowrap; position: relative;
}
.vl-nav-link::after {
  content: ''; position: absolute; bottom: 4px; left: 16px; right: 16px;
  height: 1.5px; background: var(--c-accent);
  transform: scaleX(0); transform-origin: center;
  transition: transform .25s var(--ease-out);
}
.vl-nav-link:hover { color: var(--c-accent); }
.vl-nav-link:hover::after { transform: scaleX(1); }
.vl-nav-link.active { color: var(--c-accent); }
.vl-nav-link.active::after { transform: scaleX(1); }
.vl-nav-link svg { width: 9px; height: 9px; fill: currentColor; transition: transform .2s; }
.vl-nav-item:hover .vl-nav-link svg { transform: rotate(180deg); }

/* IMPROVEMENT 8: Mega menu with editorial panel */
.vl-mega-drop {
  display: none; position: fixed; top: auto; left: 0; right: 0;
  background: var(--c-white); border-top: 2px solid var(--c-accent);
  border-bottom: 1px solid var(--c-border);
  box-shadow: 0 20px 60px rgba(0,0,0,.12); z-index: 500; padding: 32px;
  animation: megaDrop .22s var(--ease-out);
}
@keyframes megaDrop { from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:translateY(0)} }
.vl-nav-item:hover .vl-mega-drop { display: flex; gap: 32px; }
.vl-mega-drop__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; flex: 1; }
.vl-mega-cat-link {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px; border-radius: 8px;
  font-size: 12.5px; font-weight: 500; letter-spacing: .3px;
  transition: background .15s, color .15s;
  border: 1px solid transparent;
}
.vl-mega-cat-link:hover { background: var(--c-bg2); color: var(--c-accent); border-color: var(--c-border); }
.vl-mega-cat-thumb { width: 44px; height: 44px; border-radius: 8px; object-fit: cover; background: var(--c-bg2); flex-shrink: 0; border: 1px solid var(--c-border); }
.vl-mega-editorial { width: 220px; flex-shrink: 0; border-left: 1px solid var(--c-border); padding-left: 32px; }
.vl-mega-editorial-img { width: 100%; height: 160px; border-radius: 10px; object-fit: cover; background: var(--c-bg2); margin-bottom: 12px; }
.vl-mega-editorial-label { font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: var(--c-accent); font-weight: 700; margin-bottom: 6px; }
.vl-mega-editorial-title { font-family: var(--f-head); font-size: 18px; font-weight: 600; margin-bottom: 8px; }

.vl-simple-drop {
  display: none; position: absolute; top: 100%; left: 0;
  min-width: 200px; background: var(--c-white);
  border: 1px solid var(--c-border); border-top: 2px solid var(--c-accent);
  border-radius: 0 0 10px 10px; box-shadow: var(--shadow-md); z-index: 500; padding: 8px 0;
  animation: megaDrop .18s var(--ease-out);
}
.vl-nav-item:hover .vl-simple-drop { display: block; }
.vl-simple-drop a { display: block; padding: 10px 18px; font-size: 13px; transition: background .1s, color .1s; }
.vl-simple-drop a:hover { background: var(--c-bg2); color: var(--c-accent); }

/* IMPROVEMENT 9: Refined header utilities */
.vl-header-utils { display: flex; align-items: center; gap: 2px; flex-shrink: 0; }
.vl-icon-btn {
  width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;
  border-radius: 50%; transition: background .15s; position: relative; color: var(--c-text);
}
.vl-icon-btn:hover { background: var(--c-bg2); color: var(--c-accent); }
.vl-icon-btn svg { width: 20px; height: 20px; stroke: currentColor; stroke-width: 1.5; fill: none; }

/* IMPROVEMENT 10: Cart badge animated pulse */
.vl-cart-count {
  position: absolute; top: 1px; right: 1px;
  min-width: 18px; height: 18px; border-radius: 9px; padding: 0 4px;
  background: var(--c-accent); color: var(--c-dark);
  font-size: 10px; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  pointer-events: none; transition: transform .25s var(--ease-bounce);
  border: 2px solid var(--c-white);
}
.vl-cart-count.bump { transform: scale(1.5); }

/* IMPROVEMENT 11: Search with thumbnails */
.vl-search-form { position: relative; flex: 1; max-width: 480px; }
.vl-search-inner {
  display: flex; align-items: center;
  border: 1.5px solid var(--c-border); border-radius: 28px; overflow: hidden; height: 42px;
  transition: border-color .2s, box-shadow .2s; background: var(--c-bg);
}
.vl-search-inner:focus-within { border-color: var(--c-accent); box-shadow: 0 0 0 3px var(--c-accent-light); }
.vl-search-input {
  flex: 1; border: none; outline: none; padding: 0 16px;
  font-size: 13px; background: transparent; color: var(--c-text); letter-spacing: .2px;
}
.vl-search-input::placeholder { color: #c0b8b0; }
.vl-search-submit {
  width: 44px; height: 100%; display: flex; align-items: center; justify-content: center;
  background: var(--c-accent); transition: background .15s; flex-shrink: 0;
  border-radius: 0 28px 28px 0;
}
.vl-search-submit:hover { background: var(--c-accent2); }
.vl-search-submit svg { width: 15px; height: 15px; stroke: var(--c-dark); stroke-width: 2; fill: none; }
.vl-predict {
  display: none; position: absolute; top: calc(100% + 8px); left: 0; right: 0;
  background: var(--c-white); border: 1px solid var(--c-border);
  border-radius: 14px; box-shadow: var(--shadow-lg);
  z-index: 600; overflow: hidden; max-height: 420px; overflow-y: auto;
}
.vl-predict.open { display: block; animation: megaDrop .18s var(--ease-out); }
.vl-predict__head { padding: 12px 16px 6px; font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: var(--c-muted); border-bottom: 1px solid var(--c-border); }
.vl-predict a { display: flex; align-items: center; gap: 14px; padding: 11px 16px; font-size: 13px; transition: background .1s; }
.vl-predict a:hover { background: var(--c-bg2); }
.vl-predict img { width: 48px; height: 48px; object-fit: cover; border-radius: 8px; border: 1px solid var(--c-border); flex-shrink: 0; }
.vl-predict-name { flex: 1; font-weight: 600; line-height: 1.35; }
.vl-predict-price { font-weight: 700; color: var(--c-accent); font-family: var(--f-head); font-size: 14px; white-space: nowrap; }
.vl-predict-empty { padding: 20px 16px; color: var(--c-muted); font-size: 13px; text-align: center; }

/* IMPROVEMENT 12: Animated hamburger */
.vl-hamburger {
  display: none; flex-direction: column; gap: 5px;
  width: 40px; height: 40px; align-items: center; justify-content: center;
  border-radius: 50%; transition: background .15s; flex-shrink: 0;
}
.vl-hamburger:hover { background: var(--c-bg2); }
.vl-hamburger span {
  display: block; height: 1.5px;
  background: var(--c-text); border-radius: 2px; transition: all .3s var(--ease-out);
}
.vl-hamburger span:nth-child(1) { width: 20px; }
.vl-hamburger span:nth-child(2) { width: 14px; }
.vl-hamburger span:nth-child(3) { width: 20px; }
.vl-hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); width: 20px; }
.vl-hamburger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.vl-hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); width: 20px; }

/* IMPROVEMENT 13: Blur backdrop overlay */
.vl-drawer-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(10,10,20,.55); z-index: 800;
  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
}
.vl-drawer-overlay.open { display: block; animation: fadeIn .25s var(--ease-out); }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }

/* IMPROVEMENT 14: Premium mobile menu */
.vl-mobile-menu {
  position: fixed; top: 0; left: -340px; width: 320px;
  height: 100dvh; background: var(--c-white); z-index: 900;
  transition: left .35s var(--ease-out); overflow-y: auto;
  display: flex; flex-direction: column;
  box-shadow: 4px 0 40px rgba(0,0,0,.15);
}
.vl-mobile-menu.open { left: 0; }
.vl-mobile-menu__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 22px; border-bottom: 1px solid var(--c-border);
  background: linear-gradient(135deg, #CC2200, #FF6B00);
}
.vl-mobile-menu__head-logo { font-family: var(--f-head); font-size: 20px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: #fff; }
.vl-mobile-menu__close { width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; cursor: pointer; border-radius: 50%; transition: background .15s; }
.vl-mobile-menu__close:hover { background: rgba(255,255,255,.2); }
.vl-mobile-menu__close svg { width: 16px; height: 16px; stroke: #fff; stroke-width: 2; fill: none; }
.vl-mobile-menu nav { padding: 8px 0; flex: 1; }
.vl-mobile-menu nav a { display: flex; align-items: center; justify-content: space-between; padding: 14px 22px; font-size: 14px; font-weight: 500; border-bottom: 1px solid var(--c-border); transition: color .15s, background .15s; letter-spacing: .3px; }
.vl-mobile-menu nav a:hover { color: var(--c-accent); background: var(--c-bg2); }
.vl-mobile-menu__footer { padding: 20px 22px; border-top: 1px solid var(--c-border); background: var(--c-bg2); }

/* IMPROVEMENT 15: Cart drawer */
.vl-cart-drawer {
  position: fixed; top: 0; right: -460px; width: 430px;
  height: 100dvh; background: var(--c-white); z-index: 900;
  transition: right .38s var(--ease-out); display: flex; flex-direction: column;
  box-shadow: -8px 0 60px rgba(0,0,0,.15);
}
.vl-cart-drawer.open { right: 0; }
.vl-cart-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 22px 26px; border-bottom: 1px solid var(--c-border); background: var(--c-bg2); }
.vl-cart-drawer__title { font-family: var(--f-head); font-size: 22px; font-weight: 600; letter-spacing: .5px; }
.vl-cart-drawer__count { font-size: 12px; color: var(--c-muted); margin-top: 2px; }
.vl-cart-drawer__close { width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; cursor: pointer; border-radius: 50%; transition: background .15s; background: var(--c-white); border: 1px solid var(--c-border); }
.vl-cart-drawer__close:hover { background: var(--c-bg); }
.vl-cart-drawer__close svg { width: 16px; height: 16px; stroke: var(--c-text); stroke-width: 2; fill: none; }
.vl-cart-drawer__items { flex: 1; overflow-y: auto; padding: 16px 26px; }
.vl-cart-item { display: flex; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--c-border); animation: fadeIn .2s var(--ease-out); }
.vl-cart-item__img { width: 76px; height: 76px; border-radius: 10px; object-fit: cover; border: 1px solid var(--c-border); flex-shrink: 0; }
.vl-cart-item__info { flex: 1; min-width: 0; }
.vl-cart-item__name { font-size: 13.5px; font-weight: 600; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vl-cart-item__variant { font-size: 11.5px; color: var(--c-muted); margin-top: 3px; }
.vl-cart-item__bottom { display: flex; align-items: center; justify-content: space-between; margin-top: 8px; }
.vl-cart-item__price { font-size: 14.5px; font-weight: 700; font-family: var(--f-head); }
.vl-cart-item__remove { font-size: 11px; color: var(--c-muted); cursor: pointer; border-bottom: 1px solid transparent; transition: color .15s, border-color .15s; background: none; padding: 0; }
.vl-cart-item__remove:hover { color: #c0392b; border-bottom-color: #c0392b; }
.vl-cart-drawer__empty { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 60px 20px; color: var(--c-muted); gap: 14px; text-align: center; }
.vl-cart-drawer__empty svg { width: 56px; height: 56px; stroke: var(--c-border); fill: none; stroke-width: 1.2; }
.vl-cart-drawer__empty p { font-size: 15px; font-family: var(--f-head); color: var(--c-text); }
.vl-cart-drawer__foot { padding: 20px 26px; border-top: 1px solid var(--c-border); }
.vl-cart-ship-bar { background: var(--c-bg2); border-radius: 10px; padding: 11px 14px; margin-bottom: 16px; font-size: 12.5px; line-height: 1.4; }
.vl-cart-ship-bar__track { height: 4px; background: var(--c-border); border-radius: 2px; margin-top: 8px; overflow: hidden; }
.vl-cart-ship-bar__fill { height: 100%; background: linear-gradient(90deg, var(--c-accent2), var(--c-accent)); border-radius: 2px; transition: width .6s var(--ease-out); }
.vl-cart-subtotal { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 6px; }
.vl-cart-subtotal__label { font-size: 13px; font-weight: 600; }
.vl-cart-subtotal__amt { font-size: 22px; font-weight: 700; font-family: var(--f-head); }

/* IMPROVEMENT 16: Premium buttons with shine sweep */
.vl-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 14px 30px; border-radius: var(--r-btn);
  font-size: 12.5px; font-weight: 700; letter-spacing: 1px;
  cursor: pointer; border: 2px solid transparent;
  transition: var(--transition); text-decoration: none; white-space: nowrap;
  text-transform: uppercase; position: relative; overflow: hidden;
}
.vl-btn::before {
  content: ''; position: absolute; inset: 0;
  background: rgba(255,255,255,.1);
  transform: translateX(-100%) skewX(-15deg);
  transition: transform .5s var(--ease-out);
}
.vl-btn:hover::before { transform: translateX(200%) skewX(-15deg); }
.vl-btn-primary  { background: var(--c-dark); color: var(--c-white); border-color: var(--c-dark); }
.vl-btn-primary:hover { background: var(--c-accent); border-color: var(--c-accent); color: #fff; }
.vl-btn-accent   { background: linear-gradient(135deg, var(--c-accent2), var(--c-accent)); color: #fff; border-color: var(--c-accent); }
.vl-btn-accent:hover { background: linear-gradient(135deg, #FFB800, var(--c-accent)); border-color: #FFB800; color: var(--c-dark); }
.vl-btn-outline  { background: transparent; color: var(--c-dark); border-color: var(--c-dark); }
.vl-btn-outline:hover { background: var(--c-dark); color: var(--c-white); }
.vl-btn-outline-accent { background: transparent; color: var(--c-accent); border-color: var(--c-accent); }
.vl-btn-outline-accent:hover { background: var(--c-accent); color: var(--c-dark); }
.vl-btn-white    { background: var(--c-white); color: var(--c-dark); border-color: var(--c-white); }
.vl-btn-white:hover { background: transparent; color: var(--c-white); }
.vl-btn-ghost    { background: rgba(255,255,255,.12); color: #fff; border-color: rgba(255,255,255,.3); }
.vl-btn-ghost:hover { background: rgba(255,255,255,.22); border-color: rgba(255,255,255,.5); }
.vl-btn-full { width: 100%; }
.vl-btn:disabled { opacity: .45; cursor: not-allowed; }
.vl-btn:disabled::before { display: none; }
.vl-btn svg { width: 15px; height: 15px; }
.vl-btn-sm { padding: 9px 18px; font-size: 11.5px; }
.vl-btn-lg { padding: 16px 40px; font-size: 14px; }
@keyframes spin { to{transform:rotate(360deg)} }

/* IMPROVEMENT 17: Cinematic hero */
.vl-hero { position: relative; min-height: 100svh; display: flex; align-items: center; overflow: hidden; background: var(--c-dark); }
.vl-hero__bg { position: absolute; inset: 0; background-size: cover; background-position: center; }
.vl-hero__bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(110deg, rgba(26,26,46,.82) 35%, rgba(26,26,46,.15) 100%); }
.vl-hero__content { position: relative; z-index: 2; max-width: 620px; padding: 120px 40px 60px; color: var(--c-white); }
.vl-hero__eyebrow { font-size: 10px; font-weight: 700; letter-spacing: 4px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 16px; display: flex; align-items: center; gap: 10px; }
.vl-hero__eyebrow::before { content: ''; display: block; width: 32px; height: 1px; background: var(--c-accent); }
.vl-hero__title { font-family: var(--f-head); font-size: 42px; font-weight: 700; line-height: 1.05; margin-bottom: 12px; letter-spacing: -1px; }
.vl-hero__title em { font-style: italic; color: var(--c-accent); }
.vl-hero__subtitle { font-size: 16px; line-height: 1.7; opacity: .82; margin-bottom: 36px; max-width: 440px; font-weight: 300; }
.vl-hero__btns { display: flex; gap: 14px; flex-wrap: wrap; }
.vl-hero__scroll { display: none !important; position: absolute; bottom: 32px; left: 80px; display: flex; flex-direction: column; align-items: center; gap: 8px; color: rgba(255,255,255,.5); font-size: 9px; letter-spacing: 2.5px; text-transform: uppercase; }
.vl-hero__scroll-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--c-accent); animation: scrollBounce 2s ease infinite; }
@keyframes scrollBounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(8px)} }

/* IMPROVEMENT 18: Section headers with gold accent label */
.vl-sec-head { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 32px; }
.vl-sec-head-center { text-align: center; flex-direction: column; align-items: center; gap: 10px; }
.vl-sec-label { font-size: 10px; font-weight: 700; letter-spacing: 3.5px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 8px; display: flex; align-items: center; gap: 10px; justify-content: center; }
.vl-sec-label::before, .vl-sec-label::after { content: ''; display: block; flex: 1; max-width: 40px; height: 1px; background: var(--c-accent-mid); }
.vl-sec-title { font-family: var(--f-head); font-size: 36px; font-weight: 600; letter-spacing: -.5px; }
.vl-sec-title-lg { font-size: 48px; }
.vl-sec-sub { font-size: 14px; color: var(--c-muted); margin-top: 8px; max-width: 520px; line-height: 1.7; }
.vl-sec-all { font-size: 12px; font-weight: 700; color: var(--c-accent); display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; letter-spacing: .8px; text-transform: uppercase; border-bottom: 1px solid transparent; transition: border-color .15s; padding-bottom: 2px; }
.vl-sec-all:hover { border-bottom-color: var(--c-accent); color: var(--c-accent); }
.vl-sec-all svg { width: 12px; height: 12px; fill: currentColor; }
.vl-divider { border: none; border-top: 1px solid var(--c-border); margin: 0; }

/* IMPROVEMENT 19: Category cards with hover CTA */
.vl-cat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
@media (max-width: 1100px) { .vl-cat-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px)  { .vl-cat-grid { grid-template-columns: repeat(2, 1fr); } }
.vl-cat-card { position: relative; border-radius: 14px; overflow: hidden; aspect-ratio: 3/4; cursor: pointer; display: block; background: var(--c-bg2); }
.vl-cat-card:hover .vl-cat-card__img { transform: scale(1.07); }
.vl-cat-card:hover .vl-cat-card__overlay { opacity: 1; }
.vl-cat-card:hover .vl-cat-card__cta { opacity: 1; transform: translateY(0); }
.vl-cat-card__img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s var(--ease-out); }
.vl-cat-card__overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(26,26,46,.85) 45%, transparent); opacity: .72; transition: opacity .35s; }
.vl-cat-card__info { position: absolute; bottom: 0; left: 0; right: 0; padding: 22px 18px; color: var(--c-white); }
.vl-cat-card__name { font-family: var(--f-head); font-size: 21px; font-weight: 600; margin-bottom: 4px; }
.vl-cat-card__count { font-size: 12px; opacity: .75; }
.vl-cat-card__cta { display: inline-flex; align-items: center; gap: 5px; margin-top: 8px; font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--c-accent); opacity: 0; transform: translateY(6px); transition: opacity .3s, transform .3s; }

/* IMPROVEMENT 20: Product grid */
.vl-grid { display: grid; grid-template-columns: repeat(var(--cols, 4), 1fr); gap: 20px; }
@media (max-width: 1280px) { .vl-grid { --cols: 3; } }
@media (max-width: 800px)  { .vl-grid { --cols: 2; } }
@media (max-width: 380px)  { .vl-grid { --cols: 1; } }
.vl-grid-6 { --cols: 6; }
@media (max-width: 1400px) { .vl-grid-6 { --cols: 5; } }
@media (max-width: 1100px) { .vl-grid-6 { --cols: 4; } }
@media (max-width: 800px)  { .vl-grid-6 { --cols: 3; } }
@media (max-width: 540px)  { .vl-grid-6 { --cols: 2; } }

/* IMPROVEMENT 21: Premium product card */
.vl-card { background: var(--c-white); border-radius: var(--r-card); overflow: hidden; display: flex; flex-direction: column; transition: box-shadow .35s, transform .35s; cursor: pointer; position: relative; border: 1px solid transparent; }
.vl-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-4px); border-color: var(--c-border); }
.vl-card__img-wrap { position: relative; padding-top: 115%; background: var(--c-bg2); overflow: hidden; }
.vl-card__img-wrap img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .55s var(--ease-out); }
.vl-card:hover .vl-card__img-wrap img { transform: scale(1.08); }

/* IMPROVEMENT 22: Refined badges */
.vl-badge { position: absolute; top: 10px; left: 10px; font-size: 10px; font-weight: 900; letter-spacing: .5px; padding: 5px 10px; border-radius: 20px; z-index: 2; text-transform: uppercase; line-height: 1; white-space: nowrap; }
.vl-badge-sale     { background: #e53935; color: #fff; box-shadow: 0 2px 8px rgba(229,57,53,.35); }
.vl-badge-new      { background: var(--c-dark); color: var(--c-accent); border: 1px solid var(--c-accent); }
.vl-badge-hot      { background: var(--c-accent); color: var(--c-dark); }
.vl-badge-limited  { background: rgba(26,26,46,.85); color: var(--c-white); backdrop-filter: blur(4px); }
.vl-badge-soldout  { background: rgba(100,100,100,.8); color: #fff; }
.vl-badge-bestseller { background: #6d4c41; color: #f5e6d3; }

/* IMPROVEMENT 23: Wishlist bounce */
.vl-wish { position: absolute; top: 12px; right: 12px; width: 34px; height: 34px; background: rgba(255,255,255,.92); border-radius: 50%; display: flex; align-items: center; justify-content: center; z-index: 3; cursor: pointer; transition: background .15s, transform .2s var(--ease-bounce); border: 1px solid rgba(255,255,255,.5); backdrop-filter: blur(4px); }
.vl-wish:hover { background: #fff; transform: scale(1.12); }
.vl-wish svg { width: 16px; height: 16px; fill: none; stroke: #888; stroke-width: 1.8; transition: fill .2s, stroke .2s; }
.vl-wish.on svg { fill: #e74c3c; stroke: #e74c3c; }
.vl-wish.on { animation: wishPop .35s var(--ease-bounce); }
@keyframes wishPop { 0%,100%{transform:scale(1)} 50%{transform:scale(1.35)} }

/* IMPROVEMENT 24: Quick add slide */
.vl-card__quick { position: absolute; bottom: 0; left: 0; right: 0; background: rgba(26,26,46,.92); color: #fff; padding: 13px 16px; text-align: center; font-size: 11.5px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; opacity: 0; transform: translateY(100%); transition: opacity .28s, transform .28s var(--ease-out); z-index: 4; cursor: pointer; border: none; width: 100%; }
.vl-card:hover .vl-card__quick { opacity: 1; transform: translateY(0); }
.vl-card__quick:hover { background: rgba(201,169,110,.95); color: var(--c-dark); }

.vl-card__body { padding: 14px 16px 16px; flex: 1; display: flex; flex-direction: column; gap: 5px; }

/* IMPROVEMENT 25: Rating stars */
.vl-stars { display: flex; align-items: center; gap: 2px; }
.vl-star       { width: 12px; height: 12px; fill: var(--c-accent); flex-shrink: 0; }
.vl-star-empty { fill: none; stroke: #d4c9b8; stroke-width: 1.5; }
.vl-rating-count { font-size: 10.5px; color: var(--c-muted); margin-left: 5px; }
.vl-card__title { font-size: 13px; font-weight: 600; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: color .2s; }
.vl-card:hover .vl-card__title { color: var(--c-accent); }
.vl-card__meta { font-size: 11px; color: var(--c-muted); letter-spacing: .5px; text-transform: uppercase; }

/* IMPROVEMENT 26: Price display */
.vl-price-row { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.vl-price { font-size: 17px; font-weight: 700; font-family: var(--f-head); color: var(--c-dark); }
.vl-price-compare { font-size: 12.5px; color: #bbb; text-decoration: line-through; }
.vl-price-save { font-size: 11px; font-weight: 800; color: #fff; background: var(--c-sale); padding: 3px 8px; border-radius: 4px; white-space: nowrap; }
.vl-swatches { display: flex; gap: 5px; flex-wrap: wrap; }
.vl-swatch { width: 16px; height: 16px; border-radius: 50%; cursor: pointer; border: 2px solid transparent; box-shadow: 0 0 0 1px rgba(0,0,0,.15); transition: all .15s; }
.vl-swatch:hover,.vl-swatch.on { box-shadow: 0 0 0 2px var(--c-dark); }
.vl-countdown { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--c-sale); font-weight: 700; background: rgba(192,57,43,.07); padding: 4px 9px; border-radius: 4px; }
.vl-countdown svg { width: 12px; height: 12px; fill: var(--c-sale); flex-shrink: 0; }
.vl-countdown-timer { font-family: monospace; letter-spacing: .5px; }

/* IMPROVEMENT 27: Trust badges */
.vl-trust-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border: 1px solid var(--c-border); border-radius: 14px; overflow: hidden; }
@media (max-width: 768px) { .vl-trust-row { grid-template-columns: repeat(2,1fr); } }
.vl-trust-item { display: flex; align-items: center; gap: 14px; padding: 20px 22px; border-right: 1px solid var(--c-border); transition: background .2s; }
.vl-trust-item:last-child { border-right: none; }
.vl-trust-item:hover { background: var(--c-bg2); }
.vl-trust-icon { width: 46px; height: 46px; border-radius: 12px; background: var(--c-accent-light); flex-shrink: 0; display: flex; align-items: center; justify-content: center; border: 1px solid var(--c-accent-mid); }
.vl-trust-icon svg { width: 22px; height: 22px; stroke: var(--c-accent); fill: none; stroke-width: 1.6; }
.vl-trust-text h4 { font-size: 13px; font-weight: 700; margin-bottom: 3px; }
.vl-trust-text p  { font-size: 11.5px; color: var(--c-muted); line-height: 1.45; }

/* IMPROVEMENT 28: Testimonials */
.vl-testimonials { background: var(--c-bg2); padding: 72px 0; }
.vl-testimonial-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
@media (max-width: 900px) { .vl-testimonial-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 580px) { .vl-testimonial-grid { grid-template-columns: 1fr; } }
.vl-testimonial-card { background: var(--c-white); border-radius: 14px; padding: 28px; box-shadow: var(--shadow-sm); border: 1px solid var(--c-border); position: relative; overflow: hidden; transition: box-shadow .3s, transform .3s; }
.vl-testimonial-card:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
.vl-testimonial-card::before { content: '"'; position: absolute; top: 14px; right: 20px; font-family: var(--f-head); font-size: 80px; line-height: 1; color: var(--c-accent); opacity: .12; pointer-events: none; }
.vl-test-stars { display: flex; gap: 3px; margin-bottom: 14px; }
.vl-test-star  { width: 14px; height: 14px; fill: var(--c-accent); }
.vl-test-text  { font-size: 14px; line-height: 1.75; color: var(--c-text); font-style: italic; margin-bottom: 20px; }
.vl-test-author { display: flex; align-items: center; gap: 12px; }
.vl-test-avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; background: var(--c-bg2); flex-shrink: 0; border: 2px solid var(--c-accent-mid); }
.vl-test-name { font-size: 13.5px; font-weight: 700; }
.vl-test-loc  { font-size: 11.5px; color: var(--c-muted); }
.vl-test-verified { margin-left: auto; font-size: 10px; font-weight: 700; color: #27ae60; text-transform: uppercase; display: flex; align-items: center; gap: 3px; }
.vl-test-verified svg { width: 12px; height: 12px; fill: #27ae60; }

/* IMPROVEMENT 29: Newsletter section */
.vl-newsletter { background: var(--c-dark); position: relative; overflow: hidden; padding: 80px 24px; text-align: center; color: var(--c-white); }
.vl-newsletter::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at 30% 50%, rgba(201,169,110,.08), transparent 60%), radial-gradient(ellipse at 70% 50%, rgba(201,169,110,.05), transparent 60%); pointer-events: none; }
.vl-newsletter__eyebrow { font-size: 10px; letter-spacing: 4px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 14px; position: relative; }
.vl-newsletter__title { font-family: var(--f-head); font-size: 44px; margin-bottom: 12px; position: relative; letter-spacing: -1px; }
.vl-newsletter__sub { font-size: 15px; opacity: .7; margin-bottom: 36px; max-width: 420px; margin-left: auto; margin-right: auto; position: relative; line-height: 1.7; font-weight: 300; }
.vl-newsletter__form { display: flex; max-width: 460px; margin: 0 auto; position: relative; }
.vl-newsletter__input { flex: 1; padding: 15px 20px; border: 1.5px solid rgba(255,255,255,.18); border-right: none; background: rgba(255,255,255,.08); color: #fff; font-size: 13.5px; border-radius: var(--r-btn) 0 0 var(--r-btn); outline: none; transition: border-color .2s; }
.vl-newsletter__input::placeholder { color: rgba(255,255,255,.35); }
.vl-newsletter__input:focus { border-color: var(--c-accent); background: rgba(255,255,255,.12); }
.vl-newsletter__btn { background: var(--c-accent); color: var(--c-dark); font-weight: 800; padding: 15px 24px; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; border-radius: 0 var(--r-btn) var(--r-btn) 0; cursor: pointer; border: none; transition: background .15s; white-space: nowrap; }
.vl-newsletter__btn:hover { background: #d4b070; }
.vl-newsletter__note { font-size: 11px; opacity: .4; margin-top: 14px; position: relative; }

/* IMPROVEMENT 30: Newsletter popup */
.vl-popup-overlay { display: none; position: fixed; inset: 0; background: rgba(5,5,15,.7); z-index: 1000; align-items: center; justify-content: center; backdrop-filter: blur(5px); padding: 20px; }
.vl-popup-overlay.open { display: flex; }
.vl-popup { background: var(--c-white); border-radius: 18px; max-width: 520px; width: 100%; overflow: hidden; display: grid; grid-template-columns: 1fr 1fr; box-shadow: var(--shadow-xl); animation: popIn .35s var(--ease-bounce); position: relative; }
@keyframes popIn { from{transform:scale(.85) translateY(20px);opacity:0} to{transform:scale(1) translateY(0);opacity:1} }
.vl-popup__img-col { background: var(--c-dark); position: relative; min-height: 340px; }
.vl-popup__img-col img { width: 100%; height: 100%; object-fit: cover; opacity: .7; }
.vl-popup__img-col-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(26,26,46,.9), transparent); display: flex; flex-direction: column; justify-content: flex-end; padding: 24px 20px; }
.vl-popup__img-offer { font-family: var(--f-head); font-size: 42px; font-weight: 700; color: var(--c-accent); line-height: 1; }
.vl-popup__img-offer-text { font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: rgba(255,255,255,.7); margin-top: 4px; }
.vl-popup__body { padding: 32px 28px; display: flex; flex-direction: column; justify-content: center; }
.vl-popup__close { position: absolute; top: 14px; right: 14px; width: 30px; height: 30px; background: rgba(0,0,0,.35); border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 2; transition: background .15s; }
.vl-popup__close:hover { background: rgba(0,0,0,.55); }
.vl-popup__close svg { width: 13px; height: 13px; stroke: #fff; stroke-width: 2.5; fill: none; }
.vl-popup__title { font-family: var(--f-head); font-size: 26px; line-height: 1.2; margin-bottom: 8px; }
.vl-popup__sub { font-size: 13px; color: var(--c-muted); margin-bottom: 20px; line-height: 1.6; }
.vl-popup-form { display: flex; flex-direction: column; gap: 10px; }
.vl-popup-input { padding: 12px 15px; border: 1.5px solid var(--c-border); border-radius: 6px; font-size: 13px; outline: none; transition: border-color .2s, box-shadow .2s; }
.vl-popup-input:focus { border-color: var(--c-accent); box-shadow: 0 0 0 3px var(--c-accent-light); }
.vl-popup__skip { text-align: center; margin-top: 12px; font-size: 11.5px; color: var(--c-muted); cursor: pointer; }
.vl-popup__skip:hover { text-decoration: underline; }

/* IMPROVEMENT 31: Breadcrumb + page wrap */
.vl-page-wrap { max-width: 1480px; margin: 0 auto; padding: 0 24px; }
.vl-breadcrumb { font-size: 12px; color: var(--c-muted); padding: 16px 0 10px; display: flex; align-items: center; gap: 8px; }
.vl-breadcrumb a { color: var(--c-muted); transition: color .15s; }
.vl-breadcrumb a:hover { color: var(--c-accent); }
.vl-breadcrumb svg { width: 12px; height: 12px; fill: var(--c-muted); }
.vl-collection-banner { position: relative; height: 220px; margin-bottom: 32px; border-radius: 16px; overflow: hidden; background: var(--c-bg2); display: flex; align-items: center; }
.vl-collection-banner img { position: absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.vl-collection-banner__overlay { position: absolute; inset:0; background: linear-gradient(90deg, rgba(26,26,46,.75), transparent); }
.vl-collection-banner__text { position: relative; z-index:2; padding: 0 48px; color: #fff; }
.vl-collection-banner__eyebrow { font-size: 10px; letter-spacing: 3px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 8px; font-weight: 700; }
.vl-collection-banner__title { font-family: var(--f-head); font-size: 40px; font-weight: 700; }
.vl-collection-banner__count { font-size: 13px; opacity: .75; margin-top: 6px; }

/* IMPROVEMENT 32: Filter toolbar */
.vl-toolbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; gap: 14px; flex-wrap: wrap; padding: 14px 20px; background: var(--c-white); border: 1px solid var(--c-border); border-radius: 12px; }
.vl-filter-pills { display: flex; gap: 8px; flex-wrap: wrap; flex: 1; }
.vl-filter-pill { padding: 7px 16px; border-radius: 24px; border: 1.5px solid var(--c-border); font-size: 12.5px; font-weight: 600; cursor: pointer; transition: all .18s; background: var(--c-white); }
.vl-filter-pill:hover { background: var(--c-bg2); border-color: var(--c-accent); color: var(--c-accent); }
.vl-filter-pill.on { background: var(--c-dark); color: var(--c-white); border-color: var(--c-dark); }
.vl-sort-wrap { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.vl-sort-label { font-size: 12px; color: var(--c-muted); white-space: nowrap; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; }
.vl-sort-select { border: 1.5px solid var(--c-border); border-radius: 8px; padding: 8px 14px; font-size: 12.5px; background: var(--c-white); cursor: pointer; outline: none; transition: border-color .15s; }
.vl-sort-select:focus { border-color: var(--c-accent); }

/* IMPROVEMENT 33: Premium PDP */
.vl-pdp { display: grid; grid-template-columns: 1.05fr .95fr; gap: 52px; padding: 28px 0 48px; align-items: start; }
@media (max-width: 900px) { .vl-pdp { grid-template-columns: 1fr; gap: 28px; } }
.vl-gal-main { border-radius: 14px; overflow: hidden; background: var(--c-bg2); aspect-ratio: 1; position: relative; cursor: zoom-in; }
.vl-gal-main img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s var(--ease-out), opacity .25s ease; }
.vl-gal-main:hover img { transform: scale(1.04); }
.vl-gal-thumbs { display: flex; gap: 8px; margin-top: 12px; overflow-x: auto; }
.vl-gal-thumb { min-width: 72px; width: 72px; height: 72px; border-radius: 10px; overflow: hidden; border: 2px solid transparent; cursor: pointer; transition: border-color .15s, transform .15s; flex-shrink: 0; }
.vl-gal-thumb:hover { transform: scale(1.04); }
.vl-gal-thumb.on { border-color: var(--c-accent); }
.vl-gal-thumb img { width: 100%; height: 100%; object-fit: cover; }
.vl-pdp-vendor { font-size: 11px; color: var(--c-accent); font-weight: 700; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 8px; }
.vl-pdp-title { font-family: var(--f-head); font-size: 34px; font-weight: 600; line-height: 1.15; margin-bottom: 14px; letter-spacing: -.5px; }
.vl-pdp-ratings { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; font-size: 13px; color: var(--c-muted); }
.vl-pdp-prices { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.vl-pdp-price   { font-family: var(--f-head); font-size: 32px; font-weight: 700; }
.vl-pdp-compare { font-size: 20px; color: #bbb; text-decoration: line-through; }
.vl-pdp-disc    { background: var(--c-sale); color: #fff; padding: 4px 11px; border-radius: 4px; font-size: 12.5px; font-weight: 800; }
.vl-pdp-desc { font-size: 14.5px; line-height: 1.8; color: var(--c-muted); margin-bottom: 22px; }
.vl-opt-label { font-size: 11.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .8px; margin-bottom: 10px; }
.vl-opt-btns { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.vl-opt-btn { padding: 8px 18px; border: 1.5px solid var(--c-border); border-radius: var(--r-btn); font-size: 13px; cursor: pointer; transition: all .15s; background: var(--c-white); }
.vl-opt-btn:hover { border-color: var(--c-dark); }
.vl-opt-btn.on { background: var(--c-dark); color: var(--c-white); border-color: var(--c-dark); }
.vl-opt-btn.unavail { opacity: .35; cursor: not-allowed; text-decoration: line-through; }
.vl-atc-row { display: flex; gap: 10px; margin-bottom: 14px; }
.vl-qty { display: flex; align-items: center; border: 1.5px solid var(--c-border); border-radius: var(--r-btn); overflow: hidden; }
.vl-qty-btn { width: 44px; height: 52px; font-size: 22px; display: flex; align-items: center; justify-content: center; transition: background .15s; }
.vl-qty-btn:hover { background: var(--c-bg2); }
.vl-qty-in { width: 52px; text-align: center; border-left: 1px solid var(--c-border); border-right: 1px solid var(--c-border); height: 52px; font-size: 15px; font-weight: 700; border-top: none; border-bottom: none; outline: none; }
.vl-atc-btn { flex: 1; height: 52px; font-size: 13.5px; font-weight: 800; letter-spacing: 1.5px; }

/* IMPROVEMENT 34: Sticky ATC */
.vl-sticky-atc { position: fixed; bottom: 0; left: 0; right: 0; background: rgba(255,255,255,.97); border-top: 1px solid var(--c-border); padding: 14px 24px; z-index: 300; display: flex; align-items: center; gap: 20px; transform: translateY(100%); transition: transform .35s var(--ease-out); box-shadow: 0 -8px 32px rgba(0,0,0,.1); backdrop-filter: blur(8px); }
.vl-sticky-atc.show { transform: translateY(0); }
.vl-sticky-atc__info { flex: 1; min-width: 0; }
.vl-sticky-atc__title { font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vl-sticky-atc__price { font-size: 17px; font-weight: 700; font-family: var(--f-head); }

/* IMPROVEMENT 35: PDP trust grid */
.vl-pdp-trust { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 22px; border: 1px solid var(--c-border); border-radius: 12px; padding: 16px; background: var(--c-bg2); }
.vl-pdp-trust-item { display: flex; align-items: center; gap: 9px; font-size: 12.5px; color: var(--c-text); font-weight: 500; }
.vl-pdp-trust-item svg { width: 16px; height: 16px; stroke: var(--c-accent); fill: none; stroke-width: 1.8; flex-shrink: 0; }
.vl-tabs { margin-top: 48px; border-top: 1px solid var(--c-border); }
.vl-tab-nav { display: flex; gap: 0; overflow-x: auto; border-bottom: 1px solid var(--c-border); }
.vl-tab-btn { padding: 15px 24px; font-size: 13px; font-weight: 700; border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; cursor: pointer; transition: color .15s, border-color .15s; color: var(--c-muted); letter-spacing: .5px; text-transform: uppercase; }
.vl-tab-btn.on { color: var(--c-dark); border-bottom-color: var(--c-accent); }
.vl-tab-pane { display: none; padding: 28px 0; font-size: 14.5px; line-height: 1.85; }
.vl-tab-pane.on { display: block; }
.vl-tab-pane table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.vl-tab-pane table th, .vl-tab-pane table td { padding: 11px 16px; border: 1px solid var(--c-border); text-align: left; }
.vl-tab-pane table th { background: var(--c-bg2); font-weight: 700; width: 160px; }

/* IMPROVEMENT 36: Cart page */
.vl-cart-page { padding: 32px 0 70px; }
.vl-cart-page-title { font-family: var(--f-head); font-size: 40px; margin-bottom: 28px; letter-spacing: -.5px; }
.vl-cart-layout { display: grid; grid-template-columns: 1fr 360px; gap: 32px; align-items: start; }
@media (max-width: 960px) { .vl-cart-layout { grid-template-columns: 1fr; } }
.vl-cart-items { display: flex; flex-direction: column; }
.vl-cart-row { display: grid; grid-template-columns: 88px 1fr auto auto; gap: 16px; padding: 20px 0; border-bottom: 1px solid var(--c-border); align-items: center; }
.vl-cart-row-img { width: 88px; height: 88px; border-radius: 10px; object-fit: cover; border: 1px solid var(--c-border); }
.vl-cart-row-name { font-size: 14px; font-weight: 600; line-height: 1.35; }
.vl-cart-row-variant { font-size: 12px; color: var(--c-muted); margin-top: 4px; }
.vl-cart-row-remove { font-size: 11.5px; color: var(--c-muted); text-decoration: underline; cursor: pointer; margin-top: 8px; transition: color .15s; display: inline-block; }
.vl-cart-row-remove:hover { color: var(--c-sale); }
.vl-cart-row-price { font-size: 17px; font-weight: 700; font-family: var(--f-head); white-space: nowrap; }
.vl-cart-aside { position: sticky; top: 90px; }
.vl-cart-summary-box { background: var(--c-bg2); border-radius: 14px; padding: 26px; border: 1px solid var(--c-border); }
.vl-cart-summary-box h3 { font-family: var(--f-head); font-size: 22px; margin-bottom: 20px; }
.vl-cart-row-sum { display: flex; justify-content: space-between; font-size: 13.5px; margin-bottom: 12px; color: var(--c-muted); }
.vl-cart-total-sum { display: flex; justify-content: space-between; font-size: 20px; font-weight: 700; font-family: var(--f-head); border-top: 1px solid var(--c-border); padding-top: 16px; margin-top: 8px; margin-bottom: 20px; }
.vl-cart-note { font-size: 11.5px; color: var(--c-muted); text-align: center; margin-top: 12px; line-height: 1.65; }

/* IMPROVEMENT 37: Pagination */
.vl-pager { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 40px 0; }
.vl-page-btn { min-width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border: 1.5px solid var(--c-border); border-radius: var(--r-btn); font-size: 13.5px; font-weight: 600; background: var(--c-white); cursor: pointer; transition: all .2s; text-decoration: none; color: var(--c-text); }
.vl-page-btn:hover { background: var(--c-dark); color: var(--c-white); border-color: var(--c-dark); }
.vl-page-btn.on { background: var(--c-accent); color: var(--c-dark); border-color: var(--c-accent); font-weight: 800; }

/* IMPROVEMENT 38: Premium footer */
.vl-footer { background: var(--c-footer-bg); color: var(--c-footer-txt); }
.vl-footer-top { padding: 64px 24px 40px; max-width: 1480px; margin: 0 auto; display: grid; grid-template-columns: 2.2fr 1fr 1fr 1fr 1.6fr; gap: 40px; }
@media (max-width: 1100px) { .vl-footer-top { grid-template-columns: 1fr 1fr 1fr; } }
@media (max-width: 700px)  { .vl-footer-top { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px)  { .vl-footer-top { grid-template-columns: 1fr; } }
.vl-footer-brand__logo { font-family: var(--f-head); font-size: 28px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 8px; }
.vl-footer-brand__divider { width: 40px; height: 1.5px; background: var(--c-accent); margin: 12px 0; }
.vl-footer-brand__tag { font-size: 9.5px; letter-spacing: 3px; text-transform: uppercase; opacity: .45; margin-bottom: 16px; }
.vl-footer-brand__desc { font-size: 13px; line-height: 1.75; opacity: .6; max-width: 280px; }
.vl-footer-social { display: flex; gap: 10px; margin-top: 24px; }
.vl-footer-social a { width: 38px; height: 38px; border-radius: 50%; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); display: flex; align-items: center; justify-content: center; transition: background .18s, transform .18s; }
.vl-footer-social a:hover { background: var(--c-accent); border-color: var(--c-accent); color: var(--c-dark); transform: translateY(-2px); }
.vl-footer-social svg { width: 16px; height: 16px; fill: currentColor; }
.vl-footer-col h4 { font-size: 10px; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 18px; padding-bottom: 10px; border-bottom: 1px solid rgba(255,255,255,.1); }
.vl-footer-col ul { display: flex; flex-direction: column; gap: 11px; }
.vl-footer-col a { font-size: 13px; opacity: .65; transition: opacity .15s, color .15s, padding-left .15s; display: block; }
.vl-footer-col a:hover { opacity: 1; color: var(--c-accent); padding-left: 4px; }
.vl-footer-newsletter h4 { font-size: 10px; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 10px; }
.vl-footer-newsletter p { font-size: 12.5px; opacity: .6; margin-bottom: 16px; line-height: 1.65; }
.vl-footer-nl-form { display: flex; }
.vl-footer-nl-input { flex: 1; padding: 11px 15px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); color: #fff; font-size: 12.5px; border-radius: var(--r-btn) 0 0 var(--r-btn); outline: none; transition: border-color .2s; }
.vl-footer-nl-input::placeholder { color: rgba(255,255,255,.3); }
.vl-footer-nl-input:focus { border-color: var(--c-accent); }
.vl-footer-nl-btn { background: var(--c-accent); color: var(--c-dark); padding: 11px 16px; font-size: 11.5px; font-weight: 800; cursor: pointer; border: none; border-radius: 0 var(--r-btn) var(--r-btn) 0; transition: background .15s; white-space: nowrap; text-transform: uppercase; letter-spacing: .5px; }
.vl-footer-nl-btn:hover { background: #d4b070; }
.vl-payment-icons { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 18px; }
.vl-pay-icon { background: rgba(255,255,255,.08); border-radius: 5px; padding: 5px 10px; font-size: 10px; font-weight: 800; color: rgba(255,255,255,.6); border: 1px solid rgba(255,255,255,.12); text-transform: uppercase; }
.vl-footer-bottom { border-top: 1px solid rgba(255,255,255,.08); padding: 18px 24px; max-width: 1480px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; font-size: 12px; opacity: .45; }
.vl-footer-bottom a { color: inherit; text-decoration: underline; }

/* IMPROVEMENT 39: Back to top */
.vl-back-top { position: fixed; bottom: 30px; right: 26px; width: 46px; height: 46px; border-radius: 50%; background: var(--c-dark); color: #fff; display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-md); opacity: 0; pointer-events: none; transform: translateY(12px) scale(.9); transition: opacity .3s, transform .3s var(--ease-bounce); z-index: 300; }
.vl-back-top.show { opacity: 1; pointer-events: auto; transform: translateY(0) scale(1); }
.vl-back-top:hover { background: var(--c-accent); transform: translateY(-2px) scale(1); }
.vl-back-top svg { width: 18px; height: 18px; fill: currentColor; }

/* IMPROVEMENT 40: Toast notifications */
.vl-toast-container { position: fixed; top: 20px; right: 20px; z-index: 2000; display: flex; flex-direction: column; gap: 10px; max-width: 340px; pointer-events: none; }
.vl-toast { background: var(--c-dark); color: #fff; padding: 14px 18px; border-radius: 12px; box-shadow: var(--shadow-lg); display: flex; align-items: center; gap: 12px; font-size: 13.5px; font-weight: 500; line-height: 1.4; animation: toastIn .3s var(--ease-bounce); pointer-events: auto; border-left: 3px solid var(--c-accent); }
.vl-toast.success { border-left-color: #27ae60; }
.vl-toast.error   { border-left-color: #c0392b; }
@keyframes toastIn { from{opacity:0;transform:translateX(40px) scale(.95)} to{opacity:1;transform:translateX(0) scale(1)} }
.vl-toast-dismiss { margin-left: auto; opacity: .5; cursor: pointer; font-size: 18px; line-height: 1; }

/* IMPROVEMENT 41: Empty states */
.vl-empty { text-align: center; padding: 70px 20px; }
.vl-empty__icon { font-size: 64px; margin-bottom: 20px; }
.vl-empty__title { font-family: var(--f-head); font-size: 28px; margin-bottom: 10px; }
.vl-empty__sub { font-size: 14px; color: var(--c-muted); margin-bottom: 28px; line-height: 1.7; }

/* IMPROVEMENT 42: Loading skeleton */
.vl-skel { background: linear-gradient(90deg, var(--c-bg2) 25%, #ede8e0 50%, var(--c-bg2) 75%); background-size: 300% 100%; animation: skel 1.6s ease infinite; border-radius: 6px; }
@keyframes skel { 0%{background-position:200% 0} 100%{background-position:-100% 0} }

/* IMPROVEMENT 43: Scroll progress bar */
.vl-scroll-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 999; pointer-events: none; }
.vl-scroll-progress__fill { height: 100%; background: linear-gradient(90deg, var(--c-accent2), var(--c-accent)); width: var(--scroll-pct, 0%); transition: width .1s linear; }

/* IMPROVEMENT 44: Blog cards */
.vl-blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
@media (max-width: 900px) { .vl-blog-grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 560px) { .vl-blog-grid { grid-template-columns: 1fr; } }
.vl-blog-card { border-radius: 14px; overflow: hidden; background: var(--c-white); border: 1px solid var(--c-border); transition: box-shadow .3s, transform .3s; }
.vl-blog-card:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
.vl-blog-card__img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.vl-blog-card__body { padding: 20px; }
.vl-blog-card__tag { font-size: 10px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 8px; }
.vl-blog-card__title { font-family: var(--f-head); font-size: 20px; font-weight: 600; line-height: 1.3; margin-bottom: 10px; }
.vl-blog-card__excerpt { font-size: 13px; color: var(--c-muted); line-height: 1.7; margin-bottom: 16px; }
.vl-blog-card__meta { font-size: 11.5px; color: var(--c-muted); display: flex; align-items: center; gap: 8px; }

/* IMPROVEMENT 45: Premium form inputs */
.vl-input, .vl-select, .vl-textarea { width: 100%; padding: 13px 16px; border: 1.5px solid var(--c-border); border-radius: 8px; font-size: 14px; background: var(--c-white); color: var(--c-text); outline: none; transition: border-color .2s, box-shadow .2s; font-family: var(--f-body); }
.vl-input:focus, .vl-select:focus, .vl-textarea:focus { border-color: var(--c-accent); box-shadow: 0 0 0 3px var(--c-accent-light); }
.vl-input::placeholder { color: #c0b8b0; }
.vl-form-group { margin-bottom: 18px; }
.vl-label { display: block; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .8px; margin-bottom: 7px; }
.vl-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 560px) { .vl-form-row { grid-template-columns: 1fr; } }

/* IMPROVEMENT 46: Image split section */
.vl-split { display: grid; grid-template-columns: 1fr 1fr; gap: 0; min-height: 500px; overflow: hidden; border-radius: 16px; }
@media (max-width: 800px) { .vl-split { grid-template-columns: 1fr; } }
.vl-split__img { position: relative; overflow: hidden; min-height: 400px; }
.vl-split__img img { width: 100%; height: 100%; object-fit: cover; }
.vl-split__content { display: flex; flex-direction: column; justify-content: center; padding: 60px 56px; background: var(--c-bg2); }
.vl-split__content--dark { background: var(--c-dark); color: var(--c-white); }

/* IMPROVEMENT 47: Scroll-in animation */
[data-animate] { opacity: 0; transform: translateY(18px); transition: opacity .55s var(--ease-out), transform .55s var(--ease-out); }
[data-animate].in { opacity: 1; transform: translateY(0); }
[data-animate-delay="1"] { transition-delay: .1s; }
[data-animate-delay="2"] { transition-delay: .2s; }
[data-animate-delay="3"] { transition-delay: .3s; }
[data-animate-delay="4"] { transition-delay: .4s; }

/* IMPROVEMENT 48: Image lightbox */
.vl-lightbox { display: none; position: fixed; inset: 0; background: rgba(5,5,15,.95); z-index: 2000; align-items: center; justify-content: center; backdrop-filter: blur(8px); }
.vl-lightbox.open { display: flex; }
.vl-lightbox__img { max-width: 90vw; max-height: 90vh; object-fit: contain; border-radius: 4px; }
.vl-lightbox__close { position: absolute; top: 20px; right: 24px; width: 44px; height: 44px; border-radius: 50%; background: rgba(255,255,255,.15); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 22px; transition: background .15s; }
.vl-lightbox__close:hover { background: rgba(255,255,255,.25); }

/* IMPROVEMENT 49: Upsell strip */
.vl-upsell-strip { background: var(--c-accent-light); border: 1px solid var(--c-accent-mid); border-radius: 14px; padding: 18px 22px; display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }
.vl-upsell-strip__img { width: 60px; height: 60px; border-radius: 8px; object-fit: cover; flex-shrink: 0; border: 1px solid var(--c-accent-mid); }
.vl-upsell-strip__info { flex: 1; }
.vl-upsell-strip__label { font-size: 10px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 3px; }
.vl-upsell-strip__title { font-size: 14px; font-weight: 600; }
.vl-upsell-strip__price { font-family: var(--f-head); font-size: 16px; font-weight: 700; }

/* IMPROVEMENT 50: Accessibility + focus styles */
:focus-visible { outline: 2.5px solid var(--c-accent); outline-offset: 3px; border-radius: 3px; }
*:focus:not(:focus-visible) { outline: none; }

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media (max-width: 1100px) { .vl-nav { display: none; } .vl-hamburger { display: flex; } }
@media (max-width: 768px) {
  .vl-hero__title { font-size: 30px; }
  .vl-hero__content { padding: 110px 20px 40px; }
  .vl-sec-title { font-size: 28px; }
  .vl-newsletter__title { font-size: 34px; }
  .vl-popup { grid-template-columns: 1fr; }
  .vl-popup__img-col { min-height: 160px; }
  .vl-pdp-title { font-size: 28px; }
}
@media (max-width: 540px) {
  .vl-header-top { height: 62px; gap: 10px; padding: 0 16px; }
  .vl-logo-name { font-size: 20px; }
  .vl-search-form { display: none; }
  .vl-cart-drawer { width: 100%; right: -100%; }
  .vl-cart-drawer.open { right: 0; }
  .vl-pdp-trust { grid-template-columns: 1fr; }
}
@media (max-width: 380px) {
  .vl-hero__btns { flex-direction: column; }
  .vl-atc-row { flex-direction: column; }
  .vl-qty { justify-content: center; }
  .vl-atc-btn { width: 100%; }
}

/* ================================================================
   UTILITIES
   ================================================================ */
.visually-hidden { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
.text-accent { color: var(--c-accent); }
.text-muted  { color: var(--c-muted); }
.text-center { text-align: center; }
.mt-8  { margin-top: 8px; }  .mt-16 { margin-top: 16px; } .mt-24 { margin-top: 24px; }
.mt-32 { margin-top: 32px; } .mt-48 { margin-top: 48px; } .mt-64 { margin-top: 64px; }
.mb-8  { margin-bottom: 8px; } .mb-16 { margin-bottom: 16px; } .mb-24 { margin-bottom: 24px; }
.d-flex { display: flex; } .gap-8 { gap: 8px; } .gap-16 { gap: 16px; } .gap-24 { gap: 24px; }
.align-center { align-items: center; } .justify-between { justify-content: space-between; } .justify-center { justify-content: center; }
.w-full { width: 100%; } .overflow-hidden { overflow: hidden; } .relative { position: relative; }
@media print { .vl-header,.vl-footer,.vl-cart-drawer,.vl-mobile-menu,.vl-back-top,.vl-sticky-atc { display: none !important; } }

/* ================================================================
   VELORA v5.1 — Premium Enhancements
   Hero animated BG + Product Card v2 + 20 Homepage Improvements
   ================================================================ */

/* ── ENHANCEMENT 1: Hero animated gradient background ─────────── */
.vl-hero--v5 { min-height: 100svh; }

.vl-hero__bg--animated {
  position: absolute; inset: 0;
  background: linear-gradient(135deg,
    #CC2200 0%,
    #E85000 20%,
    #FF6B00 40%,
    #FFB800 60%,
    #FF6B00 80%,
    #CC2200 100%);
  background-size: 400% 400%;
  animation: heroGradient 10s ease infinite;
}
@keyframes heroGradient {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.vl-hero__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(110deg, rgba(28,8,0,.70) 35%, rgba(28,8,0,.15) 100%);
}

/* Floating particles */
.vl-hero__particles {
  position: absolute; inset: 0; overflow: hidden; pointer-events: none;
}
.vl-hero__particles span {
  position: absolute;
  display: block;
  border-radius: 50%;
  background: var(--c-accent);
  opacity: .12;
  animation: floatParticle linear infinite;
}
.vl-hero__particles span:nth-child(1)  { width:6px;  height:6px;  left:10%; animation-duration:18s; animation-delay:0s;   top:80%; }
.vl-hero__particles span:nth-child(2)  { width:4px;  height:4px;  left:20%; animation-duration:22s; animation-delay:2s;   top:60%; }
.vl-hero__particles span:nth-child(3)  { width:8px;  height:8px;  left:35%; animation-duration:16s; animation-delay:1s;   top:90%; }
.vl-hero__particles span:nth-child(4)  { width:3px;  height:3px;  left:55%; animation-duration:20s; animation-delay:3s;   top:70%; }
.vl-hero__particles span:nth-child(5)  { width:5px;  height:5px;  left:65%; animation-duration:25s; animation-delay:0.5s; top:85%; }
.vl-hero__particles span:nth-child(6)  { width:7px;  height:7px;  left:75%; animation-duration:17s; animation-delay:4s;   top:75%; }
.vl-hero__particles span:nth-child(7)  { width:4px;  height:4px;  left:85%; animation-duration:21s; animation-delay:1.5s; top:95%; }
.vl-hero__particles span:nth-child(8)  { width:6px;  height:6px;  left:45%; animation-duration:19s; animation-delay:2.5s; top:65%; }
.vl-hero__particles span:nth-child(9)  { width:3px;  height:3px;  left:90%; animation-duration:23s; animation-delay:0s;   top:88%; }
.vl-hero__particles span:nth-child(10) { width:5px;  height:5px;  left:5%;  animation-duration:26s; animation-delay:3.5s; top:72%; }
@keyframes floatParticle {
  0%   { transform: translateY(0) scale(1);    opacity: .12; }
  50%  { transform: translateY(-400px) scale(1.3); opacity: .25; }
  100% { transform: translateY(-800px) scale(0.8); opacity: 0; }
}

/* ENHANCEMENT 2: Hero stats bar */
.vl-hero__stats {
  display: flex; align-items: center; gap: 24px;
  margin-top: 20px; padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.12);
}
.vl-hero__stat { display: flex; flex-direction: column; gap: 3px; }
.vl-hero__stat-num {
  font-family: var(--f-head); font-size: 26px; font-weight: 700;
  color: var(--c-accent); line-height: 1;
}
.vl-hero__stat-label { font-size: 11px; opacity: .6; letter-spacing: .5px; text-transform: uppercase; }
.vl-hero__stat-divider { width: 1px; height: 36px; background: rgba(255,255,255,.15); }
@media (max-width: 540px) { .vl-hero__stats { gap: 16px; } .vl-hero__stat-num { font-size: 20px; } }

/* Hero content always visible (above fold — no animate needed) */
.vl-hero__content--visible {
  opacity: 1 !important;
  transform: none !important;
  animation: heroContentIn .9s var(--ease-out) both;
}
@keyframes heroContentIn {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}
.vl-hero__content {
  position: relative;
  z-index: 10;
  color: #fff;
}
.vl-hero__eyebrow,
.vl-hero__title,
.vl-hero__subtitle,
.vl-hero__btns,
.vl-hero__stats { color: #fff; }

/* ── ENHANCEMENT 4: Premium product card v5.1 ─────────────────── */
.vl-card--v5 { border-radius: 14px; }
.vl-card__img-link { position: absolute; inset: 0; display: block; }
.vl-card__img-placeholder { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 48px; color: var(--c-border); }

/* Primary image */
.vl-card__img-primary {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; transition: opacity .4s var(--ease-out), transform .55s var(--ease-out);
  opacity: 1;
}
/* Hover image — fades in on hover */
.vl-card__img-hover {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; opacity: 0;
  transition: opacity .4s var(--ease-out), transform .55s var(--ease-out);
  transform: scale(1.03);
}
.vl-card--v5:hover .vl-card__img-primary { opacity: 0; transform: scale(1.06); }
.vl-card--v5:hover .vl-card__img-hover   { opacity: 1; transform: scale(1.06); }
/* Fallback: if no hover image, still zoom primary */
.vl-card--v5:hover .vl-card__img-primary:only-child { opacity: 1; }

/* ENHANCEMENT 5: Card body refinements */
.vl-card--v5 .vl-card__body { padding: 16px 18px 18px; gap: 6px; }
.vl-card--v5 .vl-card__title { font-size: 14px; letter-spacing: -.1px; }
.vl-card--v5 .vl-price { font-size: 18px; }
.vl-card--v5 .vl-price-compare { font-size: 13px; }

/* ENHANCEMENT 6: Card shimmer on hover */
.vl-card--v5::before {
  content: ''; position: absolute; inset: 0; border-radius: 14px; z-index: 1;
  background: linear-gradient(135deg, transparent 40%, rgba(201,169,110,.08) 60%, transparent 80%);
  opacity: 0; transition: opacity .3s;
  pointer-events: none;
}
.vl-card--v5:hover::before { opacity: 1; }

/* ENHANCEMENT 7: Quick add button premium redesign */
.vl-card__quick {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  font-size: 12px;
}
.vl-card__quick svg { width: 14px; height: 14px; flex-shrink: 0; }

/* ── ENHANCEMENT 8: Section label gold line ───────────────────── */
.vl-sec-label-gold {
  display: flex; align-items: center; justify-content: center;
  gap: 12px; margin-bottom: 10px;
  font-size: 10px; font-weight: 800; letter-spacing: 3px;
  text-transform: uppercase; color: var(--c-accent);
}
.vl-sec-label-gold::before, .vl-sec-label-gold::after {
  content: ''; flex: 1; max-width: 48px; height: 1px; background: var(--c-accent);
}

/* ENHANCEMENT 9: Marquee / ticker for social proof */
.vl-ticker {
  background: var(--c-dark); color: var(--c-accent);
  padding: 12px 0; overflow: hidden;
  border-top: 1px solid rgba(201,169,110,.15);
  border-bottom: 1px solid rgba(201,169,110,.15);
}
.vl-ticker__inner {
  display: flex; gap: 60px; white-space: nowrap;
  animation: ticker 30s linear infinite;
}
.vl-ticker__inner:hover { animation-play-state: paused; }
.vl-ticker__item {
  display: flex; align-items: center; gap: 10px;
  font-size: 12px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; flex-shrink: 0;
}
.vl-ticker__item svg { width: 14px; height: 14px; fill: var(--c-accent); flex-shrink: 0; }
.vl-ticker__dot { width: 4px; height: 4px; border-radius: 50%; background: var(--c-accent); opacity: .5; }
@keyframes ticker { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* ENHANCEMENT 10: Featured product banner */
.vl-featured-banner {
  display: grid; grid-template-columns: 1fr 1fr; min-height: 480px; border-radius: 16px; overflow: hidden; margin: 0;
}
.vl-featured-banner__img { position: relative; overflow: hidden; }
.vl-featured-banner__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease-out); }
.vl-featured-banner:hover .vl-featured-banner__img img { transform: scale(1.04); }
.vl-featured-banner__content {
  background: var(--c-dark); color: var(--c-white);
  display: flex; flex-direction: column; justify-content: center; padding: 60px 52px;
}
.vl-featured-banner__label { font-size: 10px; letter-spacing: 3px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 12px; font-weight: 700; }
.vl-featured-banner__title { font-family: var(--f-head); font-size: 40px; font-weight: 700; line-height: 1.1; margin-bottom: 16px; letter-spacing: -.5px; }
.vl-featured-banner__desc { font-size: 14px; opacity: .7; line-height: 1.75; margin-bottom: 28px; max-width: 380px; }
@media (max-width: 768px) { .vl-featured-banner { grid-template-columns: 1fr; } .vl-featured-banner__img { min-height: 280px; } .vl-featured-banner__content { padding: 40px 28px; } .vl-featured-banner__title { font-size: 30px; } }

/* ENHANCEMENT 11: Horizontal scrolling product row */
.vl-scroll-row { display: flex; gap: 20px; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px; scroll-snap-type: x mandatory; }
.vl-scroll-row::-webkit-scrollbar { display: none; }
.vl-scroll-row .vl-card { min-width: 240px; width: 240px; scroll-snap-align: start; }

/* ENHANCEMENT 12: Trust bar with gold icons */
.vl-trust-row { transition: none; }
.vl-trust-icon {
  background: linear-gradient(135deg, var(--c-accent-light), rgba(201,169,110,.2));
  border: 1px solid var(--c-accent-mid);
  position: relative; overflow: hidden;
}
.vl-trust-icon::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(135deg, transparent, rgba(255,255,255,.2));
  pointer-events: none;
}

/* ENHANCEMENT 13: Section intro with decorative line */
.vl-section-intro { text-align: center; max-width: 520px; margin: 0 auto 40px; }
.vl-section-intro .vl-sec-title { margin-bottom: 12px; }
.vl-section-intro .vl-sec-sub { font-size: 15px; }
.vl-section-intro-line {
  width: 60px; height: 2px; margin: 16px auto 0;
  background: linear-gradient(90deg, transparent, var(--c-accent), transparent);
}

/* ENHANCEMENT 14: Premium hover card overlay */
.vl-card--v5:hover { box-shadow: 0 20px 60px rgba(26,26,46,.18), 0 0 0 1px var(--c-border); }

/* ENHANCEMENT 15: Back-to-top with gold ring */
.vl-back-top {
  box-shadow: 0 4px 20px rgba(0,0,0,.25), 0 0 0 2px rgba(201,169,110,.2);
}
.vl-back-top:hover { box-shadow: 0 8px 28px rgba(0,0,0,.3), 0 0 0 3px var(--c-accent); }

/* ENHANCEMENT 16: Testimonials grid — card glow on hover */
.vl-testimonial-card:hover {
  box-shadow: 0 12px 40px rgba(26,26,46,.14), 0 0 0 1px var(--c-accent-mid);
}

/* ENHANCEMENT 17: Newsletter section orb glow */
.vl-newsletter::after {
  content: '';
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 500px; height: 500px; border-radius: 50%;
  background: radial-gradient(circle, rgba(201,169,110,.06) 0%, transparent 70%);
  pointer-events: none;
}

/* ENHANCEMENT 18: Footer link hover gold slide */
.vl-footer-col a { position: relative; display: inline-block; }
.vl-footer-col a::before {
  content: '';
  position: absolute; left: -8px; top: 50%; transform: translateY(-50%);
  width: 3px; height: 0; background: var(--c-accent); border-radius: 2px;
  transition: height .2s var(--ease-out);
}
.vl-footer-col a:hover::before { height: 14px; }

/* ENHANCEMENT 19: Search bar gold glow on focus */
.vl-search-inner:focus-within {
  box-shadow: 0 0 0 3px rgba(201,169,110,.18), 0 4px 16px rgba(201,169,110,.12);
}

/* ENHANCEMENT 20: Product page gallery zoom cursor */
.vl-gal-main { cursor: zoom-in; }
.vl-gal-main::after {
  content: '🔍';
  position: absolute; bottom: 12px; right: 12px;
  width: 32px; height: 32px; border-radius: 50%;
  background: rgba(255,255,255,.9); font-size: 14px;
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity .2s;
  backdrop-filter: blur(4px);
}
.vl-gal-main:hover::after { opacity: 1; }

/* Responsive adjustments */
@media (max-width: 768px) {
  .vl-hero--v5 { min-height: 180px; }
  .vl-hero__stats { flex-wrap: wrap; gap: 12px; }
  .vl-hero__stat-divider { display: none; }
  .vl-ticker__inner { animation-duration: 20s; }
}

/* ================================================================
   MOBILE FIX — Prevent zoom + overflow issues
   ================================================================ */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}
/* Prevent iOS input zoom */
input[type="text"],
input[type="email"],
input[type="search"],
input[type="number"],
input[type="tel"],
select,
textarea {
  font-size: 16px !important;
}
/* Mobile product page */
@media (max-width: 540px) {
  .vl-pdp { gap: 20px; }
  .vl-pdp-title { font-size: 24px; }
  .vl-pdp-price { font-size: 26px; }
  .vl-atc-row { gap: 8px; }
  .vl-qty-btn { width: 36px; height: 46px; }
  .vl-qty-in  { width: 42px; height: 46px; font-size: 14px; }
  .vl-atc-btn { height: 46px; font-size: 12px; }
  .vl-gal-thumbs { gap: 6px; }
  .vl-gal-thumb  { min-width: 60px; width: 60px; height: 60px; }
  .vl-tab-btn { padding: 12px 14px; font-size: 12px; }
  .vl-opt-btn { padding: 7px 12px; font-size: 12px; }
}
/* Mobile header fix */
@media (max-width: 540px) {
  .vl-header-top { padding: 0 14px; }
  .vl-logo-name { font-size: 18px; letter-spacing: 1px; }
  .vl-icon-btn { width: 36px; height: 36px; }
  .vl-cart-count { min-width: 16px; height: 16px; font-size: 9px; }
}
/* Fix horizontal scroll on mobile */
.vl-mega-drop { display: none !important; }
@media (min-width: 1100px) {
  .vl-nav-item:hover .vl-mega-drop { display: flex !important; }
}

/* ================================================================
   v5.6 FEATURES: Search, Urgency, Quick View, Swipe, Wishlist,
                  Recently Viewed, WhatsApp
   ================================================================ */

/* ── FEATURE 1: Enhanced Predictive Search ─────────────────────── */
.vl-predict { border-radius: 16px; }
.vl-predict__head { font-size: 9.5px; }
.vl-predict a { border-radius: 0; }
.vl-predict a:first-of-type { border-radius: 16px 16px 0 0; }
.vl-predict a:last-child    { border-radius: 0 0 16px 16px; }
.vl-predict__category {
  font-size: 10px; font-weight: 700; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--c-muted);
  padding: 4px 16px 2px; background: var(--c-bg2);
}
.vl-predict img { border-radius: 8px; }
.vl-predict-vendor { font-size: 11px; color: var(--c-muted); }
.vl-predict-name   { font-weight: 600; font-size: 13.5px; }
.vl-predict-price  { font-family: var(--f-head); font-size: 15px; font-weight: 700; }
.vl-predict__footer {
  padding: 10px 16px; border-top: 1px solid var(--c-border);
  font-size: 12px; text-align: center; color: var(--c-accent);
  font-weight: 600; cursor: pointer;
}
.vl-predict__footer:hover { background: var(--c-bg2); border-radius: 0 0 16px 16px; }

/* Search loading state */
.vl-search-inner.loading .vl-search-submit { pointer-events: none; }
.vl-search-inner.loading .vl-search-submit::after {
  content: ''; display: block; width: 14px; height: 14px;
  border: 2px solid rgba(0,0,0,.3); border-top-color: var(--c-dark);
  border-radius: 50%; animation: spin .6s linear infinite;
  position: absolute;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── FEATURE 2: Stock Urgency Counter ──────────────────────────── */
.vl-urgency {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 600; color: #c0392b;
  background: rgba(192,57,43,.07); border: 1px solid rgba(192,57,43,.2);
  padding: 9px 14px; border-radius: 8px; margin-bottom: 14px;
}
.vl-urgency--safe { color: #27ae60; background: rgba(39,174,96,.07); border-color: rgba(39,174,96,.2); }
.vl-urgency__dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #c0392b; flex-shrink: 0;
  box-shadow: 0 0 0 3px rgba(192,57,43,.2);
  animation: urgencyPulse 1.5s ease infinite;
}
.vl-urgency__dot--safe { background: #27ae60; box-shadow: 0 0 0 3px rgba(39,174,96,.2); }
@keyframes urgencyPulse {
  0%,100% { box-shadow: 0 0 0 3px rgba(192,57,43,.2); }
  50%      { box-shadow: 0 0 0 6px rgba(192,57,43,.05); }
}

/* Viewer count */
.vl-viewers {
  display: flex; align-items: center; gap: 7px;
  font-size: 12.5px; color: var(--c-muted); margin-bottom: 14px;
}
.vl-viewers svg { width: 15px; height: 15px; flex-shrink: 0; color: var(--c-accent); }

/* ── FEATURE 3: Quick View Modal ───────────────────────────────── */
.vl-qv-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(5,5,15,.65); z-index: 1100;
  align-items: center; justify-content: center; padding: 20px;
  backdrop-filter: blur(6px);
}
.vl-qv-overlay.open { display: flex; }
.vl-qv {
  background: var(--c-white); border-radius: 18px;
  max-width: 860px; width: 100%; max-height: 90vh;
  overflow-y: auto; position: relative;
  box-shadow: 0 32px 80px rgba(0,0,0,.22);
  animation: qvIn .3s cubic-bezier(.34,1.56,.64,1);
}
@keyframes qvIn { from{opacity:0;transform:scale(.92) translateY(20px)} to{opacity:1;transform:scale(1) translateY(0)} }
.vl-qv__close {
  position: sticky; top: 14px; left: 100%; float: right; margin-right: 14px;
  width: 36px; height: 36px; background: var(--c-bg2); border-radius: 50%;
  display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 2;
  border: 1px solid var(--c-border); transition: background .15s;
}
.vl-qv__close:hover { background: var(--c-dark); color: #fff; }
.vl-qv__close svg { width: 16px; height: 16px; }
.vl-qv__inner { padding: 24px; }
.vl-qv__loading {
  display: flex; align-items: center; justify-content: center;
  height: 300px;
}
.vl-qv__spinner {
  width: 40px; height: 40px; border-radius: 50%;
  border: 3px solid var(--c-border); border-top-color: var(--c-accent);
  animation: spin .7s linear infinite;
}
/* Quick view content layout */
.vl-qv-layout {
  display: grid; grid-template-columns: 1fr 1fr; gap: 32px;
}
@media (max-width: 640px) { .vl-qv-layout { grid-template-columns: 1fr; } }
.vl-qv-img {
  aspect-ratio: 1; border-radius: 12px; overflow: hidden; background: var(--c-bg2);
}
.vl-qv-img img { width: 100%; height: 100%; object-fit: cover; }
.vl-qv-info { display: flex; flex-direction: column; gap: 12px; }
.vl-qv-vendor { font-size: 11px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--c-accent); }
.vl-qv-title { font-family: var(--f-head); font-size: 26px; font-weight: 600; line-height: 1.2; }
.vl-qv-price { font-family: var(--f-head); font-size: 24px; font-weight: 700; }
.vl-qv-compare { font-size: 16px; color: #bbb; text-decoration: line-through; margin-left: 8px; }
.vl-qv-desc { font-size: 13.5px; line-height: 1.75; color: var(--c-muted); }
.vl-qv-link { font-size: 12px; color: var(--c-accent); font-weight: 600; text-decoration: underline; }

/* ── FEATURE 4: Mobile Swipe Gallery ───────────────────────────── */
@media (max-width: 768px) {
  .vl-gal-main {
    overflow: hidden;
    touch-action: pan-y;
  }
  .vl-gal-main img {
    user-select: none;
    -webkit-user-drag: none;
  }
  /* Hide thumbs on mobile — swipe instead */
  .vl-gal-thumbs {
    display: flex;
    overflow-x: auto;
    gap: 6px;
    scrollbar-width: none;
  }
  .vl-gal-thumbs::-webkit-scrollbar { display: none; }
  /* Dot indicators on mobile */
  .vl-gal-dots {
    display: flex; justify-content: center; gap: 6px; margin-top: 10px;
  }
  .vl-gal-dot {
    width: 6px; height: 6px; border-radius: 50%;
    background: var(--c-border); transition: background .2s, transform .2s;
  }
  .vl-gal-dot.on { background: var(--c-accent); transform: scale(1.3); }
}
@media (min-width: 769px) { .vl-gal-dots { display: none; } }

/* ── FEATURE 5: Recently Viewed ────────────────────────────────── */
.vl-recently-viewed { background: var(--c-bg2); }
.vl-scroll-row { scroll-snap-type: x mandatory; }
.vl-scroll-row .vl-card { scroll-snap-align: start; flex-shrink: 0; }

/* ── FEATURE 6: Wishlist Page ──────────────────────────────────── */
.vl-wish-card .vl-wish { display: flex; }

/* ── FEATURE 7: WhatsApp Bubble ────────────────────────────────── */
.vl-whatsapp {
  position: fixed; bottom: 80px; right: 24px; z-index: 290;
  width: 56px; height: 56px; border-radius: 50%;
  background: #25d366; color: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 24px rgba(37,211,102,.4);
  transition: transform .2s cubic-bezier(.34,1.56,.64,1), box-shadow .2s;
  text-decoration: none;
}
.vl-whatsapp:hover {
  transform: scale(1.12);
  box-shadow: 0 10px 32px rgba(37,211,102,.5);
  color: #fff;
}
.vl-whatsapp svg { width: 28px; height: 28px; }
.vl-whatsapp__tooltip {
  position: absolute; right: 66px; top: 50%; transform: translateY(-50%);
  background: var(--c-dark); color: #fff;
  padding: 6px 12px; border-radius: 8px; font-size: 12.5px; font-weight: 600;
  white-space: nowrap; pointer-events: none;
  opacity: 0; transition: opacity .2s;
}
.vl-whatsapp__tooltip::after {
  content: ''; position: absolute; right: -6px; top: 50%; transform: translateY(-50%);
  border: 6px solid transparent; border-right: none; border-left-color: var(--c-dark);
}
.vl-whatsapp:hover .vl-whatsapp__tooltip { opacity: 1; }
/* Push back-to-top above whatsapp */
.vl-back-top { bottom: 148px; }

/* ================================================================
   v5.8 — 5 More Premium Features
   Mobile Bottom Nav · Color Filter · Reviews · Bundle · Lookbook
   ================================================================ */

/* ── FEATURE 8: Mobile Bottom Navigation Bar ───────────────────── */
.vl-bottom-nav {
  display: none;
  position: fixed; bottom: 0; left: 0; right: 0;
  height: 60px; background: var(--c-white);
  border-top: 1px solid var(--c-border);
  z-index: 350;
  box-shadow: 0 -4px 20px rgba(0,0,0,.08);
  safe-area-inset-bottom: env(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom);
}
@media (max-width: 768px) { .vl-bottom-nav { display: flex; } }
.vl-bottom-nav__item {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 3px; text-decoration: none; color: var(--c-muted);
  font-size: 9.5px; font-weight: 600; letter-spacing: .5px;
  text-transform: uppercase; transition: color .15s; position: relative;
  padding: 6px 0;
}
.vl-bottom-nav__item.active { color: var(--c-accent); font-weight: 800; }
.vl-bottom-nav__item svg { width: 22px; height: 22px; stroke: currentColor; stroke-width: 1.5; fill: none; }
.vl-bottom-nav__badge {
  position: absolute; top: 4px; right: calc(50% - 18px);
  min-width: 16px; height: 16px; border-radius: 8px; padding: 0 4px;
  background: var(--c-accent); color: var(--c-dark);
  font-size: 9px; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  border: 2px solid var(--c-white);
}
/* Push content above bottom nav on mobile */
@media (max-width: 768px) {
  main#MainContent { padding-bottom: 68px; }
  .vl-sticky-atc  { bottom: 68px; }
  .vl-back-top    { bottom: 80px; }
  .vl-whatsapp    { bottom: 88px; }
}

/* ── FEATURE 9: Color Swatch Filter (Collection Page) ──────────── */
.vl-color-filter {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--c-border);
  margin-bottom: 20px; flex-wrap: wrap;
}
.vl-color-filter__label {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 1px; color: var(--c-muted); white-space: nowrap;
}
.vl-color-filter__swatches { display: flex; gap: 7px; flex-wrap: wrap; }
.vl-color-swatch-filter {
  width: 26px; height: 26px; border-radius: 50%; cursor: pointer;
  border: 2px solid transparent;
  box-shadow: 0 0 0 1px rgba(0,0,0,.15);
  transition: all .18s; position: relative;
  text-indent: -9999px; overflow: hidden;
}
.vl-color-swatch-filter:hover, .vl-color-swatch-filter.on {
  box-shadow: 0 0 0 2px var(--c-white), 0 0 0 4px var(--c-dark);
}
.vl-color-swatch-filter.on::after {
  content: '✓'; position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 800; color: #fff;
  text-indent: 0; text-shadow: 0 1px 2px rgba(0,0,0,.5);
}
.vl-color-filter__clear {
  font-size: 11.5px; color: var(--c-muted); font-weight: 600;
  cursor: pointer; text-decoration: underline; white-space: nowrap;
  display: none;
}
.vl-color-filter__clear.show { display: block; }

/* ── FEATURE 10: Product Reviews Section ───────────────────────── */
.vl-reviews { margin-top: 48px; border-top: 1px solid var(--c-border); padding-top: 40px; }
.vl-reviews__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 28px; }
.vl-reviews__summary {
  display: flex; align-items: center; gap: 20px;
  padding: 24px; background: var(--c-bg2);
  border-radius: 14px; margin-bottom: 24px;
  border: 1px solid var(--c-border);
}
.vl-reviews__avg { text-align: center; }
.vl-reviews__avg-num { font-family: var(--f-head); font-size: 52px; font-weight: 700; color: var(--c-dark); line-height: 1; }
.vl-reviews__avg-stars { display: flex; gap: 3px; justify-content: center; margin: 6px 0; }
.vl-reviews__avg-count { font-size: 12px; color: var(--c-muted); }
.vl-reviews__bars { flex: 1; display: flex; flex-direction: column; gap: 6px; }
.vl-reviews__bar-row { display: flex; align-items: center; gap: 10px; font-size: 12px; }
.vl-reviews__bar-label { width: 40px; text-align: right; color: var(--c-muted); font-weight: 600; }
.vl-reviews__bar-track { flex: 1; height: 6px; background: var(--c-border); border-radius: 3px; overflow: hidden; }
.vl-reviews__bar-fill { height: 100%; background: linear-gradient(90deg, var(--c-accent2), var(--c-accent)); border-radius: 3px; transition: width .6s var(--ease-out); }
.vl-reviews__bar-pct { width: 32px; font-size: 11px; color: var(--c-muted); }

.vl-review-card {
  padding: 20px 0; border-bottom: 1px solid var(--c-border);
}
.vl-review-card__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.vl-review-card__author { display: flex; align-items: center; gap: 10px; }
.vl-review-card__avatar {
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--c-accent-light); border: 1px solid var(--c-accent-mid);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--f-head); font-size: 16px; font-weight: 700; color: var(--c-accent);
  flex-shrink: 0;
}
.vl-review-card__name { font-size: 14px; font-weight: 700; }
.vl-review-card__date { font-size: 11.5px; color: var(--c-muted); margin-top: 2px; }
.vl-review-card__verified { display: flex; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 700; color: #27ae60; }
.vl-review-card__verified svg { width: 12px; height: 12px; fill: #27ae60; }
.vl-review-card__stars { display: flex; gap: 2px; margin-bottom: 8px; }
.vl-review-card__star { width: 13px; height: 13px; fill: var(--c-accent); }
.vl-review-card__title { font-size: 14px; font-weight: 700; margin-bottom: 6px; }
.vl-review-card__text { font-size: 13.5px; line-height: 1.75; color: var(--c-text); }
.vl-review-card__img { width: 70px; height: 70px; border-radius: 8px; object-fit: cover; border: 1px solid var(--c-border); cursor: pointer; }

/* Write review form */
.vl-review-form { background: var(--c-bg2); border-radius: 14px; padding: 24px; margin-top: 24px; border: 1px solid var(--c-border); }
.vl-review-form h3 { font-family: var(--f-head); font-size: 20px; margin-bottom: 16px; }
.vl-star-picker { display: flex; gap: 6px; margin-bottom: 16px; }
.vl-star-pick {
  width: 32px; height: 32px; cursor: pointer;
  fill: var(--c-border); transition: fill .15s, transform .15s;
}
.vl-star-pick:hover, .vl-star-pick.on { fill: var(--c-accent); transform: scale(1.2); }

/* ── FEATURE 11: Bundle / Complete the Look ────────────────────── */
.vl-bundle {
  margin-top: 48px; padding: 28px; border-radius: 16px;
  background: var(--c-bg2); border: 1px solid var(--c-border);
}
.vl-bundle__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.vl-bundle__title { font-family: var(--f-head); font-size: 22px; font-weight: 600; }
.vl-bundle__save { background: var(--c-sale); color: #fff; font-size: 12px; font-weight: 800; padding: 5px 12px; border-radius: 20px; }
.vl-bundle__products { display: flex; align-items: center; gap: 0; }
.vl-bundle__item { flex: 1; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; padding: 0 12px; cursor: pointer; }
.vl-bundle__item-img { width: 80px; height: 80px; border-radius: 10px; object-fit: cover; border: 2px solid var(--c-border); transition: border-color .15s; }
.vl-bundle__item.on .vl-bundle__item-img { border-color: var(--c-accent); }
.vl-bundle__item-check { width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--c-border); display: flex; align-items: center; justify-content: center; transition: all .15s; }
.vl-bundle__item.on .vl-bundle__item-check { background: var(--c-accent); border-color: var(--c-accent); }
.vl-bundle__item-check svg { width: 10px; height: 10px; fill: var(--c-dark); display: none; }
.vl-bundle__item.on .vl-bundle__item-check svg { display: block; }
.vl-bundle__item-name { font-size: 12px; font-weight: 600; line-height: 1.3; }
.vl-bundle__item-price { font-size: 13px; font-weight: 700; font-family: var(--f-head); color: var(--c-accent); }
.vl-bundle__plus { font-size: 22px; color: var(--c-muted); flex-shrink: 0; }
.vl-bundle__footer { display: flex; align-items: center; justify-content: space-between; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--c-border); flex-wrap: wrap; gap: 12px; }
.vl-bundle__total { font-size: 13px; color: var(--c-muted); }
.vl-bundle__total strong { font-family: var(--f-head); font-size: 22px; color: var(--c-dark); }
.vl-bundle__original { font-size: 13px; text-decoration: line-through; color: #bbb; margin-left: 4px; }

/* ── FEATURE 12: Lookbook / Instagram Grid ─────────────────────── */
.vl-lookbook { padding: 64px 0; }
.vl-lookbook__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 3px;
}
@media (max-width: 768px) { .vl-lookbook__grid { grid-template-columns: repeat(3,1fr); } }
@media (max-width: 480px) { .vl-lookbook__grid { grid-template-columns: repeat(2,1fr); } }
.vl-lookbook__item {
  position: relative; aspect-ratio: 1; overflow: hidden;
  cursor: pointer; background: var(--c-bg2);
}
.vl-lookbook__item:first-child { grid-column: span 2; grid-row: span 2; }
.vl-lookbook__item img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s var(--ease-out); }
.vl-lookbook__item:hover img { transform: scale(1.07); }
.vl-lookbook__overlay {
  position: absolute; inset: 0;
  background: rgba(26,26,46,.55);
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transition: opacity .3s;
}
.vl-lookbook__item:hover .vl-lookbook__overlay { opacity: 1; }
.vl-lookbook__tag {
  background: rgba(255,255,255,.95); color: var(--c-dark);
  padding: 8px 14px; border-radius: 24px;
  font-size: 12px; font-weight: 700; letter-spacing: .5px;
  display: flex; align-items: center; gap: 6px;
}
.vl-lookbook__tag svg { width: 14px; height: 14px; fill: var(--c-accent); }
.vl-lookbook__ig-handle {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  margin-top: 24px; font-size: 14px; font-weight: 600; color: var(--c-muted);
  text-align: center;
}
.vl-lookbook__ig-handle svg { width: 20px; height: 20px; fill: var(--c-dark); }
.vl-lookbook__ig-handle a { color: var(--c-dark); font-weight: 700; }
.vl-lookbook__ig-handle a:hover { color: var(--c-accent); }

/* ================================================================
   v5.9 — Filter Sidebar · Exit Popup · Parallax · Counters
          Notify Me · Infinite Scroll · PWA
   ================================================================ */

/* ── FEATURE 1: Sticky Filter Sidebar ─────────────────────────── */
.vl-toolbar-v2 {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 0; margin-bottom: 16px; flex-wrap: wrap;
  border-bottom: 1px solid var(--c-border);
}
.vl-toolbar-v2__count { font-size: 13px; color: var(--c-muted); flex: 1; }
.vl-filter-toggle {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 18px; border: 1.5px solid var(--c-border);
  border-radius: 8px; font-size: 13px; font-weight: 700;
  background: var(--c-white); cursor: pointer; transition: all .15s;
  letter-spacing: .3px; white-space: nowrap;
}
.vl-filter-toggle:hover { border-color: var(--c-dark); background: var(--c-dark); color: #fff; }
.vl-filter-toggle svg { width: 16px; height: 16px; flex-shrink: 0; }
.vl-filter-toggle__count {
  background: var(--c-accent); color: var(--c-dark);
  min-width: 18px; height: 18px; border-radius: 9px; padding: 0 5px;
  font-size: 10px; font-weight: 800; display: flex; align-items: center; justify-content: center;
}

/* Active filter chips */
.vl-active-filters { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.vl-active-chip {
  display: flex; align-items: center; gap: 6px;
  background: var(--c-dark); color: #fff;
  padding: 5px 12px; border-radius: 20px; font-size: 12px; font-weight: 600;
}
.vl-active-chip__remove { cursor: pointer; opacity: .7; font-size: 14px; line-height: 1; transition: opacity .15s; }
.vl-active-chip__remove:hover { opacity: 1; }

/* Collection layout */
.vl-collection-layout { display: flex; gap: 28px; align-items: flex-start; }
.vl-collection-main { flex: 1; min-width: 0; }

/* Filter sidebar */
.vl-filter-sidebar {
  width: 256px; flex-shrink: 0;
  position: sticky; top: 88px;
  background: var(--c-white); border: 1px solid var(--c-border);
  border-radius: 14px; overflow: hidden;
  max-height: calc(100vh - 108px); overflow-y: auto;
  scrollbar-width: thin; scrollbar-color: var(--c-border) transparent;
}
@media (max-width: 900px) {
  .vl-filter-sidebar {
    position: fixed; top: 0; left: -300px; width: 280px; height: 100dvh;
    z-index: 950; border-radius: 0; transition: left .35s var(--ease-out);
    box-shadow: 4px 0 40px rgba(0,0,0,.12); max-height: none;
  }
  .vl-filter-sidebar.open { left: 0; }
  .vl-collection-layout { flex-direction: column; }
  .vl-collection-main { width: 100%; }
}
@media (min-width: 901px) {
  .vl-filter-sidebar__close { display: none; }
  .vl-filter-overlay { display: none !important; }
}
.vl-filter-sidebar__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 18px; border-bottom: 1px solid var(--c-border);
  font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: .8px;
  position: sticky; top: 0; background: var(--c-bg2); z-index: 2;
}
.vl-filter-sidebar__close { width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; cursor: pointer; border-radius: 50%; transition: background .15s; }
.vl-filter-sidebar__close:hover { background: var(--c-border); }
.vl-filter-sidebar__close svg { width: 15px; height: 15px; }
.vl-filter-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 940; backdrop-filter: blur(3px); }
.vl-filter-overlay.open { display: block; }

/* Filter groups */
.vl-filter-group { border-bottom: 1px solid var(--c-border); }
.vl-filter-group__head {
  width: 100%; display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; font-size: 13px; font-weight: 700; cursor: pointer;
  background: none; border: none; text-align: left; transition: background .1s;
}
.vl-filter-group__head:hover { background: var(--c-bg2); }
.vl-filter-group__head svg { width: 14px; height: 14px; fill: var(--c-muted); transition: transform .2s; }
.vl-filter-group__head[aria-expanded="false"] svg { transform: rotate(-90deg); }
.vl-filter-group__body { padding: 8px 18px 14px; display: flex; flex-direction: column; gap: 8px; }
.vl-filter-group__body.collapsed { display: none; }
.vl-filter-check { display: flex; align-items: center; gap: 10px; cursor: pointer; font-size: 13px; }
.vl-filter-check input { display: none; }
.vl-filter-check__box {
  width: 18px; height: 18px; border-radius: 4px; flex-shrink: 0;
  border: 2px solid var(--c-border); background: var(--c-white);
  transition: all .15s; display: flex; align-items: center; justify-content: center;
}
.vl-filter-cb:checked + .vl-filter-check__box {
  background: var(--c-dark); border-color: var(--c-dark);
}
.vl-filter-cb:checked + .vl-filter-check__box::after {
  content: '✓'; color: #fff; font-size: 11px; font-weight: 800; line-height: 1;
}
.vl-filter-check:hover .vl-filter-check__box { border-color: var(--c-dark); }

/* ── FEATURE 4: Exit Intent Popup ──────────────────────────────── */
.vl-exit-overlay {
  display: none; position: fixed; inset: 0;
  background: rgba(5,5,15,.72); z-index: 2000;
  align-items: center; justify-content: center; padding: 20px;
  backdrop-filter: blur(6px);
}
.vl-exit-overlay.open { display: flex; }
.vl-exit-popup {
  background: var(--c-white); border-radius: 22px;
  max-width: 480px; width: 100%; position: relative;
  box-shadow: 0 40px 100px rgba(0,0,0,.3);
  animation: popIn .35s cubic-bezier(.34,1.56,.64,1);
  overflow: hidden;
}
.vl-exit-popup::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px;
  background: linear-gradient(90deg, var(--c-accent2), var(--c-accent));
}
.vl-exit-popup__close {
  position: absolute; top: 14px; right: 14px;
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--c-bg2); display: flex; align-items: center; justify-content: center;
  cursor: pointer; z-index: 2; border: 1px solid var(--c-border); transition: background .15s;
}
.vl-exit-popup__close:hover { background: var(--c-dark); color: #fff; }
.vl-exit-popup__close svg { width: 14px; height: 14px; }
.vl-exit-popup__inner { padding: 36px 36px 32px; text-align: center; }
.vl-exit-popup__icon { font-size: 52px; margin-bottom: 12px; line-height: 1; }
.vl-exit-popup__eyebrow { font-size: 11px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 10px; }
.vl-exit-popup__title { font-family: var(--f-head); font-size: 28px; font-weight: 700; line-height: 1.2; margin-bottom: 12px; }
.vl-exit-popup__sub { font-size: 14px; color: var(--c-muted); line-height: 1.65; margin-bottom: 20px; }
.vl-exit-popup__code {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--c-bg2); border: 2px dashed var(--c-accent-mid);
  border-radius: 10px; padding: 12px 18px; margin-bottom: 20px;
}
.vl-exit-popup__code-label { font-size: 11px; font-weight: 700; color: var(--c-muted); text-transform: uppercase; letter-spacing: 1px; }
.vl-exit-popup__code-value { font-family: monospace; font-size: 18px; font-weight: 800; color: var(--c-dark); letter-spacing: 2px; }
.vl-exit-popup__copy {
  display: flex; align-items: center; gap: 4px; padding: 6px 12px;
  background: var(--c-dark); color: #fff; border-radius: 6px;
  font-size: 11.5px; font-weight: 700; cursor: pointer; transition: background .15s; white-space: nowrap;
}
.vl-exit-popup__copy svg { width: 12px; height: 12px; }
.vl-exit-popup__copy:hover { background: var(--c-accent); color: var(--c-dark); }
.vl-exit-popup__actions { display: flex; flex-direction: column; gap: 10px; }
.vl-exit-popup__dismiss { font-size: 12px; color: var(--c-muted); cursor: pointer; text-decoration: underline; background: none; border: none; transition: color .15s; }
.vl-exit-popup__dismiss:hover { color: var(--c-text); }
.vl-exit-popup__timer { margin-top: 14px; font-size: 12.5px; color: var(--c-muted); }
.vl-exit-popup__timer-count { font-weight: 800; color: var(--c-sale); font-family: monospace; font-size: 14px; }

/* ── FEATURE 6: Parallax Showcase Section ──────────────────────── */
.vl-parallax {
  position: relative; min-height: 560px; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  width: 100%; max-width: 100%; margin-left: 0; margin-right: 0;
}
/* Parallax must break out of any container */
.vl-section .vl-parallax,
.vl-section-sm .vl-parallax {
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  max-width: 100vw;
}
.vl-parallax__bg {
  position: absolute; inset: -15%; width: 100%; height: 130%;
  background-size: cover; background-position: center;
  will-change: transform; transform-origin: center;
}
.vl-parallax__overlay { position: absolute; inset: 0; }
.vl-parallax__content {
  position: relative; z-index: 2; color: #fff;
  text-align: center; max-width: 680px; padding: 60px 24px;
}
.vl-parallax__eyebrow { font-size: 10px; font-weight: 700; letter-spacing: 4px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 14px; display: flex; align-items: center; justify-content: center; gap: 10px; }
.vl-parallax__eyebrow::before, .vl-parallax__eyebrow::after { content: ''; display: block; width: 32px; height: 1px; background: var(--c-accent); }
.vl-parallax__title { font-family: var(--f-head); font-size: 48px; font-weight: 700; line-height: 1.1; margin-bottom: 18px; letter-spacing: -1px; }
.vl-parallax__subtitle { font-size: 16px; line-height: 1.75; opacity: .82; margin-bottom: 32px; font-weight: 300; }
.vl-parallax__stats { display: flex; align-items: center; justify-content: center; gap: 32px; margin-top: 44px; padding-top: 36px; border-top: 1px solid rgba(255,255,255,.15); flex-wrap: wrap; }
.vl-parallax__stat { text-align: center; }
.vl-parallax__stat .vl-counter { font-family: var(--f-head); font-size: 44px; font-weight: 800; color: var(--c-accent); display: inline-block; }
.vl-parallax__stat-suffix { font-family: var(--f-head); font-size: 28px; font-weight: 700; color: var(--c-accent); }
.vl-parallax__stat-label { display: block; font-size: 12px; opacity: .65; margin-top: 4px; letter-spacing: .5px; text-transform: uppercase; }
.vl-parallax__stat-divider { width: 1px; height: 48px; background: rgba(255,255,255,.15); }
@media (max-width: 640px) {
  .vl-parallax__title { font-size: 34px; }
  .vl-parallax__stats { gap: 20px; }
  .vl-parallax__stat .vl-counter { font-size: 34px; }
  .vl-parallax__stat-divider { display: none; }
}

/* ── FEATURE 7: Animated Number Counters ───────────────────────── */
.vl-counter { display: inline-block; transition: none; }

/* ── FEATURE 12: Notify Me — Sold Out ──────────────────────────── */
.vl-notify-me {
  margin-top: 16px; padding: 18px 20px;
  background: var(--c-bg2); border-radius: 12px;
  border: 1px solid var(--c-border);
}
.vl-notify-me__title {
  display: flex; align-items: center; gap: 8px;
  font-size: 14px; font-weight: 700; margin-bottom: 12px;
  color: var(--c-text);
}
.vl-notify-me__title svg { width: 16px; height: 16px; flex-shrink: 0; color: var(--c-accent); }
.vl-notify-me__form { display: flex; gap: 8px; }
.vl-notify-me__input { flex: 1; font-size: 14px !important; }
.vl-notify-me__note { font-size: 11.5px; color: var(--c-muted); margin-top: 8px; }

/* ── FEATURE 15: Infinite Scroll ───────────────────────────────── */
.vl-infinite-loader {
  display: flex; align-items: center; justify-content: center;
  gap: 12px; padding: 24px 0; font-size: 13.5px; color: var(--c-muted);
  font-weight: 500;
}
.vl-infinite-loader__spinner {
  width: 24px; height: 24px; border-radius: 50%;
  border: 2.5px solid var(--c-border); border-top-color: var(--c-accent);
  animation: spin .7s linear infinite; flex-shrink: 0;
}
/* Hide old pagination when infinite scroll active */
.vl-pager.vl-pager--hidden { display: none; }

/* ================================================================
   COMPACT CATEGORY CHIPS — replaces tall card grid
   ================================================================ */
.vl-cat-grid-compact {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

.vl-cat-chip {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px 10px 10px;
  background: var(--c-white);
  border: 1.5px solid var(--c-border);
  border-radius: 50px;
  text-decoration: none;
  color: var(--c-text);
  font-size: 13px;
  font-weight: 600;
  transition: all .2s var(--ease-out);
  white-space: nowrap;
}
.vl-cat-chip:hover {
  border-color: var(--c-accent);
  background: var(--c-accent-light);
  color: var(--c-dark);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(201,169,110,.18);
}
.vl-cat-chip__img {
  width: 40px; height: 40px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  border: 1.5px solid var(--c-border);
  background: var(--c-bg2);
}
.vl-cat-chip__img img {
  width: 100%; height: 100%; object-fit: cover;
}
.vl-cat-chip__icon {
  width: 40px; height: 40px;
  border-radius: 50%;
  background: var(--c-bg2);
  border: 1.5px solid var(--c-border);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.vl-cat-chip__icon svg {
  width: 18px; height: 18px;
  stroke: var(--c-accent);
}
.vl-cat-chip__name {
  letter-spacing: .2px;
}
.vl-cat-chip__count {
  font-size: 11px;
  font-weight: 700;
  color: var(--c-muted);
  background: var(--c-bg2);
  border-radius: 12px;
  padding: 2px 8px;
  min-width: 28px;
  text-align: center;
}
.vl-cat-chip:hover .vl-cat-chip__count {
  background: var(--c-accent-mid);
  color: var(--c-dark);
}

@media (max-width: 540px) {
  .vl-cat-grid-compact { gap: 8px; }
  .vl-cat-chip { padding: 8px 14px 8px 8px; font-size: 12px; }
  .vl-cat-chip__img, .vl-cat-chip__icon { width: 34px; height: 34px; }
}

/* ================================================================
   v6.0 — 14 PREMIUM HOMEPAGE FEATURES
   ================================================================ */

/* ── #1: Gold Cursor Trail ─────────────────────────────────────── */
.vl-cursor-dot {
  position: fixed;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--c-accent);
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%);
  transition: opacity .3s, transform .15s;
  opacity: 0;
  mix-blend-mode: multiply;
}
.vl-cursor-trail {
  position: fixed;
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--c-accent);
  pointer-events: none;
  z-index: 9998;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  animation: trailFade .6s ease forwards;
}
@keyframes trailFade {
  0%   { opacity: .7; transform: translate(-50%,-50%) scale(1); }
  100% { opacity: 0;  transform: translate(-50%,-50%) scale(0.2); }
}
@media (max-width: 768px), (hover: none) {
  .vl-cursor-dot, .vl-cursor-trail { display: none; }
}

/* ── #2: Video Hero ────────────────────────────────────────────── */
.vl-hero-video { position: absolute; inset: 0; overflow: hidden; }
.vl-hero-video video {
  width: 100%; height: 100%; object-fit: cover;
  opacity: 0; transition: opacity 1.2s ease;
}
.vl-hero-video video.loaded { opacity: 1; }
.vl-hero-video-fallback { position: absolute; inset: 0; background-size: cover; background-position: center; }

/* ── #5: Typewriter Headline ───────────────────────────────────── */
.vl-typewriter { display: inline; }
.vl-typewriter-cursor {
  display: inline-block;
  width: 3px; height: .9em;
  background: var(--c-accent);
  margin-left: 2px;
  vertical-align: text-bottom;
  animation: cursorBlink .75s step-end infinite;
}
@keyframes cursorBlink { 0%,100%{opacity:1} 50%{opacity:0} }

/* ── #4: Frosted Glass Product Cards ───────────────────────────── */
.vl-card--glass {
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.5);
  box-shadow: 0 4px 24px rgba(0,0,0,.06), inset 0 1px 0 rgba(255,255,255,.8);
}
.vl-card--glass:hover {
  background: rgba(255,255,255,.88);
  box-shadow: 0 20px 60px rgba(26,26,46,.14), inset 0 1px 0 rgba(255,255,255,.9);
  border-color: rgba(201,169,110,.35);
}
.vl-card--glass .vl-card__body {
  background: rgba(255,255,255,.6);
  backdrop-filter: blur(8px);
}

/* ── #6: Press / As Seen In Bar ───────────────────────────────── */
.vl-press-bar {
  padding: 32px 0;
  border-top: 1px solid var(--c-border);
  border-bottom: 1px solid var(--c-border);
  background: var(--c-white);
  overflow: hidden;
}
.vl-press-bar__label {
  text-align: center;
  font-size: 10px; font-weight: 700; letter-spacing: 3px;
  text-transform: uppercase; color: var(--c-muted);
  margin-bottom: 20px;
}
.vl-press-bar__logos {
  display: flex; align-items: center; justify-content: center;
  gap: 40px; flex-wrap: wrap; padding: 0 24px;
}
.vl-press-bar__logo {
  font-family: var(--f-head); font-size: 18px; font-weight: 700;
  letter-spacing: 1px; color: var(--c-muted);
  opacity: .45; transition: opacity .2s, color .2s;
  white-space: nowrap; text-decoration: none;
  filter: grayscale(1);
}
.vl-press-bar__logo:hover { opacity: .8; color: var(--c-dark); filter: none; }
.vl-press-bar__logo img {
  height: 24px; width: auto; object-fit: contain;
  filter: grayscale(1); opacity: .4; transition: all .2s;
}
.vl-press-bar__logo:hover img { filter: none; opacity: .75; }
@media (max-width: 540px) {
  .vl-press-bar__logos { gap: 24px; }
  .vl-press-bar__logo { font-size: 15px; }
}

/* ── #7: Founder Story Section ─────────────────────────────────── */
.vl-founder {
  display: grid; grid-template-columns: 1fr 1fr;
  min-height: 520px; overflow: hidden; border-radius: 16px;
  margin: 0;
}
@media (max-width: 768px) { .vl-founder { grid-template-columns: 1fr; } }
.vl-founder__img { position: relative; overflow: hidden; min-height: 360px; }
.vl-founder__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease-out); }
.vl-founder:hover .vl-founder__img img { transform: scale(1.04); }
.vl-founder__img-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to right, transparent 60%, rgba(250,250,248,.4));
}
.vl-founder__content {
  background: var(--c-bg2); display: flex; flex-direction: column;
  justify-content: center; padding: 60px 52px; position: relative;
}
.vl-founder__eyebrow {
  font-size: 10px; font-weight: 700; letter-spacing: 3px;
  text-transform: uppercase; color: var(--c-accent); margin-bottom: 20px;
  display: flex; align-items: center; gap: 10px;
}
.vl-founder__eyebrow::before {
  content: ''; width: 28px; height: 1px; background: var(--c-accent);
}
.vl-founder__quote {
  font-family: var(--f-head); font-size: 28px; font-weight: 600;
  line-height: 1.35; color: var(--c-dark); margin-bottom: 20px;
  position: relative;
}
.vl-founder__quote::before {
  content: '\201C';
  position: absolute; top: -16px; left: -8px;
  font-size: 80px; color: var(--c-accent); opacity: .15;
  font-family: Georgia, serif; line-height: 1; pointer-events: none;
}
.vl-founder__bio { font-size: 14px; line-height: 1.8; color: var(--c-muted); margin-bottom: 24px; }
.vl-founder__sig {
  font-family: var(--f-head); font-size: 22px;
  font-style: italic; color: var(--c-dark);
  border-top: 1px solid var(--c-border); padding-top: 16px;
}
.vl-founder__sig span { font-size: 11px; display: block; color: var(--c-muted); font-style: normal; letter-spacing: 1px; text-transform: uppercase; margin-top: 3px; }
@media (max-width: 768px) {
  .vl-founder__content { padding: 36px 28px; }
  .vl-founder__quote { font-size: 22px; }
}

/* ── #8: Materials Showcase ────────────────────────────────────── */
.vl-materials {
  background: var(--c-dark); padding: 72px 0; overflow: hidden;
}
.vl-materials__grid {
  display: grid; grid-template-columns: repeat(3,1fr); gap: 2px;
  margin-top: 40px;
}
@media (max-width: 640px) { .vl-materials__grid { grid-template-columns: 1fr; } }
.vl-material-card {
  position: relative; overflow: hidden;
  aspect-ratio: 4/5; cursor: pointer;
  background: var(--c-bg2);
}
.vl-material-card img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .6s var(--ease-out), filter .4s;
  filter: brightness(.85);
}
.vl-material-card:hover img { transform: scale(1.06); filter: brightness(1); }
.vl-material-card__info {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 32px 24px 24px;
  background: linear-gradient(to top, rgba(26,26,46,.92) 50%, transparent);
  color: #fff; transition: padding .3s var(--ease-out);
}
.vl-material-card:hover .vl-material-card__info { padding-bottom: 32px; }
.vl-material-card__num {
  font-size: 11px; font-weight: 700; letter-spacing: 3px;
  text-transform: uppercase; color: var(--c-accent); margin-bottom: 6px;
}
.vl-material-card__name {
  font-family: var(--f-head); font-size: 22px; font-weight: 700;
  margin-bottom: 6px;
}
.vl-material-card__desc {
  font-size: 13px; opacity: 0; transform: translateY(8px);
  transition: opacity .3s, transform .3s; line-height: 1.6;
  max-width: 260px;
}
.vl-material-card:hover .vl-material-card__desc { opacity: .8; transform: translateY(0); }

/* ── #10: Real-Time Purchase Notifications ─────────────────────── */
.vl-purchase-toast {
  position: fixed; bottom: 88px; left: 20px; z-index: 800;
  background: var(--c-white); border-radius: 14px;
  padding: 12px 16px; display: flex; align-items: center; gap: 12px;
  box-shadow: 0 8px 32px rgba(0,0,0,.14);
  border-left: 3px solid var(--c-new);
  max-width: 300px;
  transform: translateX(-120%); opacity: 0;
  transition: transform .4s cubic-bezier(.34,1.56,.64,1), opacity .4s;
  pointer-events: none;
}
.vl-purchase-toast.show { transform: translateX(0); opacity: 1; pointer-events: auto; }
.vl-purchase-toast__img {
  width: 44px; height: 44px; border-radius: 8px; object-fit: cover;
  flex-shrink: 0; border: 1px solid var(--c-border);
  background: var(--c-bg2);
}
.vl-purchase-toast__info { flex: 1; min-width: 0; }
.vl-purchase-toast__name {
  font-size: 13px; font-weight: 700; line-height: 1.3;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.vl-purchase-toast__meta { font-size: 11.5px; color: var(--c-muted); margin-top: 2px; }
.vl-purchase-toast__dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--c-new);
  flex-shrink: 0; animation: urgencyPulse 1.5s infinite;
}
.vl-purchase-toast__close {
  font-size: 16px; color: var(--c-muted); cursor: pointer;
  line-height: 1; padding: 2px; pointer-events: auto;
}
@media (max-width: 540px) {
  .vl-purchase-toast { bottom: 76px; left: 12px; max-width: calc(100vw - 24px); }
}

/* ── #17: Discount Countdown Section ───────────────────────────── */
.vl-countdown-banner {
  background: linear-gradient(135deg, var(--c-dark) 0%, var(--c-dark) 50%, var(--c-dark) 100%);
  padding: 48px 24px; text-align: center; color: #fff;
  position: relative; overflow: hidden;
}
.vl-countdown-banner::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(ellipse at center, rgba(201,169,110,.1) 0%, transparent 70%);
  pointer-events: none;
}
.vl-countdown-banner__eyebrow {
  font-size: 10px; font-weight: 700; letter-spacing: 4px;
  text-transform: uppercase; color: var(--c-accent); margin-bottom: 10px;
}
.vl-countdown-banner__title {
  font-family: var(--f-head); font-size: 36px; font-weight: 700;
  margin-bottom: 8px; position: relative;
}
.vl-countdown-banner__sub { font-size: 15px; opacity: .7; margin-bottom: 28px; }
.vl-countdown-banner__timer {
  display: flex; align-items: center; justify-content: center;
  gap: 6px; margin-bottom: 28px; position: relative;
}
.vl-countdown-unit {
  display: flex; flex-direction: column; align-items: center;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15);
  border-radius: 12px; padding: 16px 20px; min-width: 72px;
  backdrop-filter: blur(4px);
}
.vl-countdown-num {
  font-family: var(--f-head); font-size: 40px; font-weight: 800;
  color: var(--c-accent); line-height: 1; font-variant-numeric: tabular-nums;
}
.vl-countdown-label { font-size: 10px; opacity: .6; text-transform: uppercase; letter-spacing: 1.5px; margin-top: 4px; }
.vl-countdown-colon { font-size: 32px; font-weight: 700; color: var(--c-accent); opacity: .6; margin-bottom: 18px; }
@media (max-width: 480px) {
  .vl-countdown-num { font-size: 30px; }
  .vl-countdown-unit { min-width: 58px; padding: 12px 14px; }
  .vl-countdown-banner__title { font-size: 26px; }
}

/* ── #11: Magnetic Button Effect ───────────────────────────────── */
.vl-btn-magnetic { transition: transform .2s var(--ease-out), box-shadow .2s; }

/* #12 Page Transitions removed */    to{transform:translateY(-100%)} }

/* ── #13: Enhanced Scroll Animations ───────────────────────────── */
[data-reveal] {
  opacity: 0;
  transition: opacity .65s var(--ease-out), transform .65s var(--ease-out);
}
[data-reveal="up"]    { transform: translateY(40px); }
[data-reveal="down"]  { transform: translateY(-30px); }
[data-reveal="left"]  { transform: translateX(40px); }
[data-reveal="right"] { transform: translateX(-40px); }
[data-reveal="scale"] { transform: scale(.92); }
[data-reveal="fade"]  { transform: none; }
[data-reveal].revealed { opacity: 1; transform: none !important; }
[data-reveal-delay="1"] { transition-delay: .1s; }
[data-reveal-delay="2"] { transition-delay: .2s; }
[data-reveal-delay="3"] { transition-delay: .3s; }
[data-reveal-delay="4"] { transition-delay: .4s; }
[data-reveal-delay="5"] { transition-delay: .5s; }
[data-reveal-delay="6"] { transition-delay: .6s; }

/* ── #15: Gold Shimmer on Badges ───────────────────────────────── */
.vl-badge-sale, .vl-badge-new, .vl-badge-hot { border-radius: 20px;
  position: absolute; overflow: hidden;
  top: 10px; left: 10px;
}
.vl-badge-sale::after, .vl-badge-new::after, .vl-badge-hot::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(105deg, transparent 30%, rgba(255,255,255,.5) 50%, transparent 70%);
  transform: translateX(-100%);
  animation: badgeShimmer 2.5s ease infinite;
}
@keyframes badgeShimmer {
  0%,70% { transform: translateX(-100%); }
  80%     { transform: translateX(100%); }
  100%    { transform: translateX(100%); }
}

/* ── #16: Live Stock on Product Cards ──────────────────────────── */
.vl-card__stock {
  display: flex; align-items: center; gap: 5px;
  font-size: 11px; font-weight: 700;
  color: var(--c-sale); margin-top: 3px;
}
.vl-card__stock-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--c-sale); flex-shrink: 0;
  animation: urgencyPulse 1.5s infinite;
}
.vl-card__stock--safe { color: var(--c-new); }
.vl-card__stock--safe .vl-card__stock-dot { background: var(--c-new); animation: none; }

/* Materials placeholder backgrounds (no Liquid math needed) */
.vl-material-card__placeholder {
  width: 100%; min-height: 400px; height: 100%;
  background: linear-gradient(135deg, var(--c-dark) 0%, #2d2d3e 100%);
}
.vl-material-card__placeholder--1 {
  background: linear-gradient(135deg, var(--c-dark) 0%, #3d2b1f 100%);
}
.vl-material-card__placeholder--2 {
  background: linear-gradient(135deg, #1e2a1a 0%, #2d3d20 100%);
}
.vl-material-card__placeholder--3 {
  background: linear-gradient(135deg, #2a1f1a 0%, #3d2a1a 100%);
}

/* ================================================================
   v6.2 — 10 PREMIUM HEADER FEATURES
   ================================================================ */

/* ── #2 + #8: Transparent → Frosted Glass Sticky Header ────────── */
.vl-header {
  position: relative;
  transition: background .35s ease, box-shadow .35s ease,
              backdrop-filter .35s ease, border-color .35s ease;
  border-bottom: 1px solid transparent;
}
.vl-header--transparent {
  background: transparent;
}
.vl-header--transparent .vl-logo-name,
.vl-header--transparent .vl-nav-link,
.vl-header--transparent .vl-icon-btn svg { color: #fff; stroke: #fff; }
.vl-header--transparent .vl-logo-tag { color: rgba(255,255,255,.6); }
.vl-header--transparent .vl-search-inner { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.2); }
.vl-header--transparent .vl-search-input { color: #fff; }
.vl-header--transparent .vl-search-input::placeholder { color: rgba(255,255,255,.55); }
.vl-header--transparent .vl-search-submit svg { stroke: rgba(255,255,255,.7); }
.vl-header--transparent .vl-hamburger__line { background: #fff; }

.vl-header--scrolled {
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom-color: var(--c-border);
  box-shadow: 0 2px 24px rgba(0,0,0,.06);
}
/* On non-hero pages (no transparent needed) */
body:not(.template-index) .vl-header,
body.template-index .vl-header--scrolled { background: rgba(255,255,255,.92); backdrop-filter: blur(20px); border-bottom-color: var(--c-border); }
body:not(.template-index) .vl-header .vl-logo-name,
body:not(.template-index) .vl-header .vl-nav-link { color: var(--c-dark); }
body:not(.template-index) .vl-header .vl-icon-btn svg { stroke: var(--c-dark); }
body:not(.template-index) .vl-header .vl-hamburger__line { background: var(--c-dark); }
body:not(.template-index) .vl-header .vl-search-inner { background: var(--c-bg2); border-color: var(--c-border); }
body:not(.template-index) .vl-header .vl-search-input { color: var(--c-text); }

/* ── #1: Mega Menu with Product Images ─────────────────────────── */
.vl-mega-drop { display: none; } /* hide old */
.vl-mega-menu {
  position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
  background: var(--c-white);
  border: 1px solid var(--c-border);
  border-radius: 16px;
  box-shadow: 0 24px 64px rgba(0,0,0,.14);
  min-width: 680px;
  opacity: 0; visibility: hidden; pointer-events: none;
  transform: translateX(-50%) translateY(12px);
  transition: opacity .25s var(--ease-out), transform .25s var(--ease-out), visibility .25s;
  z-index: 100; overflow: hidden;
}
.vl-nav-item--has-mega:hover .vl-mega-menu,
.vl-nav-item--has-mega:focus-within .vl-mega-menu {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.vl-mega-menu__inner {
  display: grid; grid-template-columns: 1fr 220px; gap: 0;
}
.vl-mega-menu__collections { padding: 24px; border-right: 1px solid var(--c-border); }
.vl-mega-menu__featured    { padding: 24px; background: var(--c-bg2); }
.vl-mega-menu__col-label {
  font-size: 9.5px; font-weight: 800; letter-spacing: 2.5px;
  text-transform: uppercase; color: var(--c-muted); margin-bottom: 14px;
}
.vl-mega-menu__grid {
  display: grid; grid-template-columns: repeat(4,1fr); gap: 6px;
}
.vl-mega-col-item {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 10px 6px; border-radius: 10px; text-decoration: none;
  color: var(--c-text); font-size: 11.5px; font-weight: 600;
  text-align: center; transition: background .15s, color .15s;
}
.vl-mega-col-item:hover { background: var(--c-bg2); color: var(--c-accent); }
.vl-mega-col-item__img {
  width: 56px; height: 56px; border-radius: 10px; overflow: hidden;
  border: 1px solid var(--c-border); background: var(--c-bg2);
}
.vl-mega-col-item__img img { width: 100%; height: 100%; object-fit: cover; }
.vl-mega-col-item__placeholder {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
}
.vl-mega-col-item__placeholder svg { width: 22px; stroke: var(--c-muted); }
.vl-mega-col-item__name { line-height: 1.2; }
.vl-mega-col-item__count { font-size: 10px; color: var(--c-muted); font-weight: 400; }
.vl-mega-menu__products { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }
.vl-mega-product {
  display: flex; align-items: center; gap: 10px;
  text-decoration: none; color: var(--c-text);
  padding: 6px; border-radius: 8px; transition: background .15s;
}
.vl-mega-product:hover { background: var(--c-border); }
.vl-mega-product__img {
  width: 44px; height: 44px; border-radius: 6px; overflow: hidden;
  flex-shrink: 0; border: 1px solid var(--c-border); background: var(--c-bg2);
}
.vl-mega-product__img img { width: 100%; height: 100%; object-fit: cover; }
.vl-mega-product__info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.vl-mega-product__name  { font-size: 12px; font-weight: 600; line-height: 1.3; }
.vl-mega-product__price { font-size: 12px; color: var(--c-accent); font-weight: 700; font-family: var(--f-head); }
.vl-mega-menu__cta {
  display: flex; align-items: center; gap: 6px; justify-content: center;
  font-size: 12px; font-weight: 700; color: var(--c-dark);
  border: 1.5px solid var(--c-dark); border-radius: 8px; padding: 9px;
  text-decoration: none; transition: all .15s;
}
.vl-mega-menu__cta:hover { background: var(--c-dark); color: #fff; }
.vl-mega-menu__cta svg { width: 14px; height: 14px; }

/* ── #6: Gold Underline Nav Hover ──────────────────────────────── */
.vl-nav-link {
  position: relative; padding-bottom: 2px;
}
.vl-nav-link::after {
  content: ''; position: absolute; bottom: -2px; left: 0;
  width: 0; height: 1.5px;
  background: linear-gradient(90deg, var(--c-accent2), var(--c-accent));
  transition: width .28s var(--ease-out); border-radius: 1px;
}
.vl-nav-link:hover::after,
.vl-nav-item--active .vl-nav-link::after { width: 100%; }
.vl-nav-arrow { transition: transform .2s; }
.vl-nav-item--has-mega:hover .vl-nav-arrow { transform: rotate(180deg); }

/* ── #9: Animated Hamburger → X ────────────────────────────────── */
.vl-hamburger { flex-direction: column; gap: 5px; width: 32px; height: 32px; justify-content: center; align-items: center; }
.vl-hamburger__line {
  display: block; width: 22px; height: 1.8px;
  background: currentColor; border-radius: 2px;
  transform-origin: center;
  transition: transform .3s var(--ease-out), opacity .2s, width .3s var(--ease-out);
}
.vl-hamburger.open .vl-hamburger__line--top  { transform: translateY(6.8px) rotate(45deg); }
.vl-hamburger.open .vl-hamburger__line--mid  { opacity: 0; width: 0; }
.vl-hamburger.open .vl-hamburger__line--bot  { transform: translateY(-6.8px) rotate(-45deg); }

/* ── #3: Smart Search with Tabs ────────────────────────────────── */
.vl-predict__tabs {
  display: flex; gap: 4px; padding: 12px 14px 6px; border-bottom: 1px solid var(--c-border);
}
.vl-predict__tab {
  padding: 5px 14px; border-radius: 20px; font-size: 12px; font-weight: 700;
  cursor: pointer; transition: all .15s; border: 1.5px solid var(--c-border);
  background: none; color: var(--c-muted);
}
.vl-predict__tab.on { background: var(--c-dark); color: #fff; border-color: var(--c-dark); }
.vl-predict__trending { padding: 8px 14px; }
.vl-predict__trending-item {
  display: flex; align-items: center; gap: 8px; padding: 7px 6px;
  border-radius: 7px; text-decoration: none; color: var(--c-text); font-size: 13px;
  font-weight: 500; transition: background .12s;
}
.vl-predict__trending-item:hover { background: var(--c-bg2); }
.vl-predict__trending-item svg { width: 14px; height: 14px; stroke: var(--c-accent); flex-shrink: 0; }

/* ── #4: Mini Cart Preview ──────────────────────────────────────── */
.vl-cart-wrap { position: relative; }
.vl-mini-cart {
  position: absolute; top: calc(100% + 12px); right: 0;
  width: 300px; background: var(--c-white);
  border: 1px solid var(--c-border); border-radius: 14px;
  box-shadow: 0 16px 48px rgba(0,0,0,.14);
  opacity: 0; visibility: hidden; pointer-events: none;
  transform: translateY(8px);
  transition: opacity .2s var(--ease-out), transform .2s var(--ease-out), visibility .2s;
  z-index: 200; overflow: hidden;
  padding: 14px;
}
.vl-cart-wrap:hover .vl-mini-cart,
.vl-mini-cart:hover {
  opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0);
}
.vl-mini-cart__empty { font-size: 13px; color: var(--c-muted); text-align: center; padding: 12px 0; }
.vl-mini-cart__item {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 0; border-bottom: 1px solid var(--c-border);
}
.vl-mini-cart__item:last-of-type { border-bottom: none; }
.vl-mini-cart__img {
  width: 48px; height: 48px; border-radius: 7px; object-fit: cover;
  border: 1px solid var(--c-border); flex-shrink: 0;
}
.vl-mini-cart__name  { font-size: 12.5px; font-weight: 600; line-height: 1.3; flex: 1; min-width: 0; }
.vl-mini-cart__price { font-size: 13px; font-weight: 700; color: var(--c-accent); font-family: var(--f-head); white-space: nowrap; }
.vl-mini-cart__checkout { margin-top: 12px; padding: 11px; font-size: 13px; }

/* ── #11: Wishlist Count Badge ──────────────────────────────────── */
.vl-icon-btn--wish { position: relative; }
.vl-wish-count {
  position: absolute; top: -4px; right: -4px;
  min-width: 16px; height: 16px; border-radius: 8px;
  background: var(--c-accent); color: var(--c-dark);
  font-size: 9px; font-weight: 800; padding: 0 4px;
  display: flex; align-items: center; justify-content: center;
  border: 1.5px solid var(--c-white);
}

/* ── #13: Cart Count Bounce Animation ──────────────────────────── */
@keyframes cartBounce {
  0%   { transform: scale(1); }
  30%  { transform: scale(1.5); }
  55%  { transform: scale(0.85); }
  75%  { transform: scale(1.15); }
  100% { transform: scale(1); }
}
.vl-cart-count--bounce { animation: cartBounce .5s var(--ease-out); }
@keyframes cartPop {
  0%   { transform: scale(1) rotate(0deg); }
  25%  { transform: scale(1.2) rotate(-8deg); }
  50%  { transform: scale(0.9) rotate(6deg); }
  75%  { transform: scale(1.05) rotate(-3deg); }
  100% { transform: scale(1) rotate(0deg); }
}
.vl-cart-icon--pop { animation: cartPop .4s var(--ease-out); }

/* ── #19: Rotating Announcement Bar ────────────────────────────── */
.vl-announcement__slider { position: relative; overflow: hidden; height: 18px; }
.vl-announcement__slide {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  opacity: 0; transform: translateY(10px);
  transition: opacity .4s ease, transform .4s ease;
  pointer-events: none; font-size: 12.5px;
}
.vl-announcement__slide.active { opacity: 1; transform: translateY(0); pointer-events: auto; }
.vl-announcement__slide.exit   { opacity: 0; transform: translateY(-10px); }

/* Push main content below fixed header */
.vl-hero, .vl-hero--v5 { padding-top: 0; }
body.template-index main#MainContent > *:first-child { margin-top: 0; }
body:not(.template-index) main#MainContent { padding-top: 80px; }

/* ================================================================
   TOPBAR FIX — single fixed container for all top bars
   ================================================================ */
.vl-topbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 500;
}

/* Announcement bar styles for rotating version */
.vl-announcement {
  padding: 9px 48px;
}
.vl-announcement__slider {
  height: 20px;
}

/* Non-homepage: push main content below topbar (set by JS) */
body:not(.template-index) main#MainContent {
  padding-top: var(--topbar-height, 120px);
}

/* Homepage: hero starts at top:0, topbar overlays it */
body.template-index main#MainContent {
  padding-top: 0;
}
body.template-index .vl-hero--v5 {
  margin-top: 0;
  min-height: 200px;
}

/* All pages: page-wrap sections get correct offset */
body:not(.template-index) .vl-page-wrap {
  padding-top: 16px;
}

/* ================================================================
   PREMIUM CATEGORY GRID v2 — 10 Features
   ================================================================ */

/* ── Section Header with animated gold underline (#16) ────────── */
.vl-cat-section { padding: 64px 0; }
.vl-cat-section__head { text-align: center; margin-bottom: 40px; }
.vl-cat-section__title-wrap { display: inline-block; position: relative; margin-bottom: 10px; }
.vl-cat-section__title {
  font-family: var(--f-head); font-size: 42px; font-weight: 700;
  letter-spacing: -.5px; margin: 0;
}
.vl-cat-section__title-line {
  height: 2px; background: linear-gradient(90deg, transparent, var(--c-accent), transparent);
  width: 0; margin: 8px auto 0;
  transition: width .9s var(--ease-out);
}
.vl-cat-section__head.revealed .vl-cat-section__title-line { width: 100%; }
.vl-cat-section__sub { font-size: 15px; color: var(--c-muted); margin-top: 4px; }

/* ── #1 + #2 + #17: Two-row layout — large cards + chips ──────── */
.vl-cat-large-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-bottom: 14px;
}
@media (max-width: 768px) { .vl-cat-large-row { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .vl-cat-large-row { grid-template-columns: 1fr; } }

/* ── #1: Large category card ───────────────────────────────────── */
.vl-cat-card-v2 {
  position: relative; border-radius: 16px; overflow: hidden;
  aspect-ratio: 3/4;
  transition: box-shadow .35s var(--ease-out), transform .35s var(--ease-out);
  background: var(--c-bg2);
  /* #4: Gold border glow */
  border: 1.5px solid transparent;
}
.vl-cat-card-v2:hover {
  transform: translateY(-6px);
  border-color: var(--c-accent);
  box-shadow:
    0 20px 60px rgba(0,0,0,.2),
    0 0 0 1px var(--c-accent-mid),
    0 0 24px rgba(201,169,110,.25);
}
.vl-cat-card-v2__link { display: block; width: 100%; height: 100%; position: absolute; inset: 0; text-decoration: none; color: #fff; }

/* #1: Zoom on hover */
.vl-cat-card-v2__img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .65s var(--ease-out), filter .4s;
  transform-origin: center;
  filter: brightness(.82);
}
.vl-cat-card-v2__img--placeholder {
  background: linear-gradient(135deg, var(--c-dark), #2d2d4e);
  display: flex; align-items: center; justify-content: center;
}
.vl-cat-card-v2__img--placeholder svg { width: 48px; stroke: rgba(255,255,255,.2); }
.vl-cat-card-v2:hover .vl-cat-card-v2__img { transform: scale(1.09); filter: brightness(.65); }

/* Gradient overlay */
.vl-cat-card-v2__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(10,10,26,.9) 0%, rgba(10,10,26,.3) 50%, transparent 100%);
  transition: opacity .3s;
}
.vl-cat-card-v2:hover .vl-cat-card-v2__overlay { opacity: 1.3; }

/* #12: Most Popular badge */
.vl-cat-card-v2__badge {
  position: absolute; top: 14px; left: 14px;
  background: var(--c-accent); color: var(--c-dark);
  font-size: 10px; font-weight: 800; letter-spacing: 1px;
  text-transform: uppercase; padding: 5px 10px; border-radius: 20px;
  z-index: 3;
}
.vl-cat-card-v2__badge--popular {
  background: linear-gradient(135deg, var(--c-accent2), var(--c-accent));
  animation: badgeShimmer 2.5s ease infinite;
}

/* Card info block */
.vl-cat-card-v2__info {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 24px 20px 20px; z-index: 2;
  transform: translateY(8px);
  transition: transform .35s var(--ease-out);
}
.vl-cat-card-v2:hover .vl-cat-card-v2__info { transform: translateY(0); }
.vl-cat-card-v2__info-top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.vl-cat-card-v2__name { font-family: var(--f-head); font-size: 22px; font-weight: 700; line-height: 1.2; }
.vl-cat-card-v2__count { font-size: 11px; opacity: .65; font-weight: 500; white-space: nowrap; }
.vl-cat-card-v2__desc { font-size: 12.5px; opacity: 0; transform: translateY(6px); transition: opacity .3s .05s, transform .3s .05s; margin-bottom: 12px; line-height: 1.5; max-width: 240px; }
.vl-cat-card-v2:hover .vl-cat-card-v2__desc { opacity: .75; transform: translateY(0); }

/* #6: Shop Now CTA */
.vl-cat-card-v2__cta {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--c-accent); color: var(--c-dark);
  font-size: 11.5px; font-weight: 800; letter-spacing: .8px; text-transform: uppercase;
  padding: 8px 16px; border-radius: 24px;
  opacity: 0; transform: translateY(8px);
  transition: opacity .3s .1s, transform .3s .1s;
}
.vl-cat-card-v2:hover .vl-cat-card-v2__cta { opacity: 1; transform: translateY(0); }
.vl-cat-card-v2__cta svg { width: 13px; height: 13px; transition: transform .2s; }
.vl-cat-card-v2:hover .vl-cat-card-v2__cta svg { transform: translateX(3px); }

/* #9: Product preview on hover */
.vl-cat-card-v2__preview {
  position: absolute; top: 14px; right: 14px;
  display: flex; gap: 5px;
  opacity: 0; transform: translateX(8px);
  transition: opacity .3s, transform .3s;
  z-index: 4;
}
.vl-cat-card-v2:hover .vl-cat-card-v2__preview { opacity: 1; transform: translateX(0); }
.vl-cat-card-v2__preview-imgs { display: flex; gap: 5px; }
.vl-cat-preview-thumb {
  width: 38px; height: 38px; border-radius: 7px; object-fit: cover;
  border: 1.5px solid rgba(255,255,255,.5);
  transition: transform .2s;
  background: rgba(255,255,255,.15);
}
.vl-cat-preview-thumb:hover { transform: scale(1.1); }

/* ── #14: Horizontal scroll chips on mobile ────────────────────── */
.vl-cat-chips-row {
  display: flex; flex-wrap: wrap; gap: 10px; justify-content: center;
  margin-top: 6px;
}
@media (max-width: 768px) {
  .vl-cat-chips-row {
    flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start;
    scroll-snap-type: x mandatory; scrollbar-width: none;
    padding-bottom: 4px; -webkit-overflow-scrolling: touch;
  }
  .vl-cat-chips-row::-webkit-scrollbar { display: none; }
  .vl-cat-chip--sm { scroll-snap-align: start; flex-shrink: 0; }
}
.vl-cat-chip__popular {
  color: var(--c-accent); font-size: 13px; margin-left: 2px;
}

/* ── #20: View All button ──────────────────────────────────────── */
.vl-cat-section__footer { text-align: center; margin-top: 36px; }
.vl-cat-section__view-all {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 14px; font-weight: 700; color: var(--c-dark);
  border: 2px solid var(--c-dark); border-radius: 50px;
  padding: 12px 28px; text-decoration: none;
  transition: all .25s var(--ease-out); letter-spacing: .3px;
  position: relative; overflow: hidden;
}
.vl-cat-section__view-all::before {
  content: ''; position: absolute; inset: 0;
  background: var(--c-dark);
  transform: translateX(-101%);
  transition: transform .3s var(--ease-out);
}
.vl-cat-section__view-all:hover { color: #fff; border-color: var(--c-dark); }
.vl-cat-section__view-all:hover::before { transform: translateX(0); }
.vl-cat-section__view-all span,
.vl-cat-section__view-all svg { position: relative; z-index: 1; }
.vl-cat-section__view-all svg { width: 16px; height: 16px; transition: transform .25s; }
.vl-cat-section__view-all:hover svg { transform: translateX(4px); }

/* ================================================================
   PREMIUM COLLECTIONS LIST PAGE
   ================================================================ */

/* ── Hero Banner ───────────────────────────────────────────────── */
.vl-collist-hero {
  position: relative;
  min-height: 420px;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden; text-align: center;
}
.vl-collist-hero__bg {
  position: absolute; inset: -10%;
  background: linear-gradient(135deg, var(--c-dark) 0%, var(--c-dark) 40%, var(--c-dark) 70%, #1a0e2e 100%);
  background-size: 400% 400%;
  animation: heroGradient 14s ease infinite;
}
.vl-collist-hero__overlay {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 30% 50%, rgba(201,169,110,.08) 0%, transparent 65%);
}
.vl-collist-hero__content {
  position: relative; z-index: 2;
  color: #fff; padding: 80px 24px 60px; max-width: 640px;
}
.vl-collist-hero__eyebrow {
  font-size: 10px; font-weight: 700; letter-spacing: 4px;
  text-transform: uppercase; color: var(--c-accent); margin-bottom: 14px;
  display: flex; align-items: center; justify-content: center; gap: 10px;
}
.vl-collist-hero__eyebrow::before,
.vl-collist-hero__eyebrow::after {
  content: ''; flex: 1; max-width: 36px; height: 1px; background: var(--c-accent);
}
.vl-collist-hero__title {
  font-family: var(--f-head); font-size: 56px; font-weight: 700;
  line-height: 1.05; letter-spacing: -1px; margin-bottom: 16px;
}
.vl-collist-hero__sub {
  font-size: 16px; opacity: .72; line-height: 1.75; font-weight: 300;
}
.vl-collist-hero__scroll {
  position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  font-size: 9px; letter-spacing: 3px; text-transform: uppercase;
  color: rgba(255,255,255,.4); z-index: 2;
}
.vl-collist-hero__scroll-dot {
  width: 5px; height: 5px; border-radius: 50%; background: var(--c-accent);
  animation: scrollBounce 1.6s ease infinite;
}
@keyframes scrollBounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(6px)} }
@media (max-width: 640px) { .vl-collist-hero__title { font-size: 38px; } }

/* ── Stats Strip ───────────────────────────────────────────────── */
.vl-collist-stats {
  background: var(--c-dark);
  border-bottom: 1px solid rgba(201,169,110,.15);
  padding: 20px 0;
}
.vl-collist-stats__inner {
  display: flex; align-items: center; justify-content: center;
  gap: 32px; flex-wrap: wrap;
}
.vl-collist-stat { text-align: center; }
.vl-collist-stat__num {
  font-family: var(--f-head); font-size: 28px; font-weight: 800;
  color: var(--c-accent); display: block; line-height: 1;
}
.vl-collist-stat__label {
  font-size: 10px; color: rgba(255,255,255,.5);
  text-transform: uppercase; letter-spacing: 1.5px; display: block;
  margin-top: 3px;
}
.vl-collist-stat__div {
  width: 1px; height: 36px; background: rgba(255,255,255,.1);
}
@media (max-width: 540px) {
  .vl-collist-stat__div { display: none; }
  .vl-collist-stats__inner { gap: 20px; }
}

/* ── Collections Grid ──────────────────────────────────────────── */
.vl-collist-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  grid-auto-rows: 340px;
}
@media (max-width: 960px) {
  .vl-collist-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 280px; }
}
@media (max-width: 540px) {
  .vl-collist-grid { grid-template-columns: 1fr; grid-auto-rows: 260px; }
}

/* Large cards span 2 columns + 2 rows */
.vl-collist-card--large {
  grid-column: span 2;
  grid-row: span 1;
}
@media (max-width: 540px) {
  .vl-collist-card--large { grid-column: span 1; }
}

/* ── Collection Card ───────────────────────────────────────────── */
.vl-collist-card {
  position: relative; border-radius: 16px; overflow: hidden;
  text-decoration: none; color: #fff;
  background: var(--c-bg2);
  transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out), border-color .35s;
  border: 1.5px solid transparent;
  display: block;
}
.vl-collist-card:hover {
  transform: translateY(-5px);
  border-color: var(--c-accent);
  box-shadow: 0 20px 60px rgba(0,0,0,.22), 0 0 0 1px var(--c-accent-mid), 0 0 30px rgba(201,169,110,.15);
}

/* Image */
.vl-collist-card__img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; transition: transform .65s var(--ease-out), filter .4s;
  filter: brightness(.75);
}
.vl-collist-card__img--placeholder {
  background: linear-gradient(135deg, var(--c-dark), #2d2d4e);
  display: flex; align-items: center; justify-content: center;
}
.vl-collist-card__img--placeholder svg { width: 60px; stroke: rgba(255,255,255,.1); }
.vl-collist-card:hover .vl-collist-card__img { transform: scale(1.07); filter: brightness(.55); }

/* Overlay */
.vl-collist-card__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(10,10,26,.95) 0%, rgba(10,10,26,.2) 60%, transparent 100%);
}

/* Badges */
.vl-collist-card__badge {
  position: absolute; top: 16px; left: 16px; z-index: 3;
  font-size: 10px; font-weight: 800; letter-spacing: 1px;
  text-transform: uppercase; padding: 5px 12px; border-radius: 20px;
}
.vl-collist-card__badge--popular {
  background: linear-gradient(135deg, var(--c-accent2), var(--c-accent));
  color: var(--c-dark); animation: badgeShimmer 2.5s ease infinite;
}
.vl-collist-card__badge--new {
  background: rgba(39,174,96,.9); color: #fff;
}

/* Body */
.vl-collist-card__body {
  position: absolute; inset: 0; z-index: 2;
  display: flex; flex-direction: column;
  justify-content: space-between; padding: 18px 20px;
}
.vl-collist-card__top { display: flex; justify-content: flex-end; }
.vl-collist-card__index {
  font-family: var(--f-head); font-size: 13px; font-weight: 700;
  color: rgba(255,255,255,.3); letter-spacing: 1px;
}
.vl-collist-card__bottom { }
.vl-collist-card__title {
  font-family: var(--f-head); font-size: 24px; font-weight: 700;
  line-height: 1.2; margin-bottom: 8px; margin: 0 0 6px;
}
.vl-collist-card--large .vl-collist-card__title { font-size: 30px; }
.vl-collist-card__meta {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin-top: 6px;
}
.vl-collist-card__count {
  font-size: 12px; opacity: .6; font-weight: 500;
}
.vl-collist-card__arrow {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11.5px; font-weight: 800; letter-spacing: .8px;
  text-transform: uppercase;
  background: var(--c-accent); color: var(--c-dark);
  padding: 7px 14px; border-radius: 20px;
  opacity: 0; transform: translateY(6px);
  transition: opacity .3s, transform .3s;
}
.vl-collist-card:hover .vl-collist-card__arrow { opacity: 1; transform: translateY(0); }
.vl-collist-card__arrow svg { width: 12px; height: 12px; transition: transform .2s; }
.vl-collist-card:hover .vl-collist-card__arrow svg { transform: translateX(3px); }

/* Description */
.vl-collist-card__desc {
  font-size: 12.5px; opacity: 0; transform: translateY(5px);
  transition: opacity .3s .05s, transform .3s .05s;
  line-height: 1.55; margin-top: 5px; max-width: 360px; color: rgba(255,255,255,.7);
}
.vl-collist-card:hover .vl-collist-card__desc { opacity: 1; transform: translateY(0); }

/* Product preview strip */
.vl-collist-card__preview {
  position: absolute; top: 16px; right: 16px; z-index: 3;
  display: flex; gap: 5px;
  opacity: 0; transform: translateY(-5px);
  transition: opacity .3s, transform .3s;
}
.vl-collist-card:hover .vl-collist-card__preview { opacity: 1; transform: translateY(0); }
.vl-collist-preview-img {
  width: 40px; height: 40px; border-radius: 8px; object-fit: cover;
  border: 1.5px solid rgba(255,255,255,.35); background: rgba(255,255,255,.1);
  transition: transform .2s;
}
.vl-collist-preview-img:hover { transform: scale(1.12); }
@media (max-width: 540px) { .vl-collist-card__preview { display: none; } }

/* ================================================================
   6-PER-ROW COMPACT CATEGORY GRID
   ================================================================ */

/* Section spacing fix */
.vl-cat-section { padding: 40px 0 48px; }

/* 6 columns grid */
.vl-cat-6grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
  margin-top: 0;
}
@media (max-width: 1100px) { .vl-cat-6grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 700px)  { .vl-cat-6grid { grid-template-columns: repeat(3, 1fr); gap: 8px; } }
@media (max-width: 440px)  { .vl-cat-6grid { grid-template-columns: repeat(2, 1fr); gap: 8px; } }

/* Compact card */
.vl-cat-6card {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: var(--c-text);
  border-radius: 12px;
  overflow: hidden;
  background: var(--c-white);
  border: 1.5px solid var(--c-border);
  transition: border-color .25s, box-shadow .25s, transform .25s var(--ease-out);
}
.vl-cat-6card:hover {
  border-color: var(--c-accent);
  transform: translateY(-4px);
  box-shadow: 0 12px 36px rgba(0,0,0,.1), 0 0 0 1px var(--c-accent-mid), 0 0 18px rgba(201,169,110,.15);
}

/* Image */
.vl-cat-6card__img-wrap {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--c-bg2);
}
.vl-cat-6card__img-wrap img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .5s var(--ease-out), filter .3s;
  filter: brightness(.88);
}
.vl-cat-6card:hover .vl-cat-6card__img-wrap img {
  transform: scale(1.08);
  filter: brightness(.7);
}
.vl-cat-6card__placeholder {
  width: 100%; height: 100%;
  background: linear-gradient(135deg, var(--c-bg2), var(--c-border));
  display: flex; align-items: center; justify-content: center;
}
.vl-cat-6card__placeholder svg { width: 28px; stroke: var(--c-muted); }
.vl-cat-6card__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(26,26,46,.5) 0%, transparent 60%);
  opacity: 0; transition: opacity .3s;
}
.vl-cat-6card:hover .vl-cat-6card__overlay { opacity: 1; }

/* Badges */
.vl-cat-6card__badge {
  position: absolute; top: 7px; left: 7px;
  background: var(--c-accent); color: var(--c-dark);
  font-size: 9px; font-weight: 800; letter-spacing: .8px;
  text-transform: uppercase; padding: 3px 8px; border-radius: 10px;
  z-index: 2;
}
.vl-cat-6card__badge--pop {
  background: linear-gradient(135deg, var(--c-accent2), var(--c-accent));
  animation: badgeShimmer 2.5s ease infinite;
  font-size: 11px;
}
.vl-cat-6card--popular .vl-cat-6card__img-wrap {
  border-bottom: 2px solid var(--c-accent);
}

/* Card body */
.vl-cat-6card__body {
  padding: 10px 12px 11px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  background: var(--c-white);
  transition: background .2s;
}
.vl-cat-6card:hover .vl-cat-6card__body { background: var(--c-accent-light); }
.vl-cat-6card__name {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--c-dark);
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.vl-cat-6card__count {
  font-size: 10.5px;
  color: var(--c-muted);
  font-weight: 500;
}
.vl-cat-6card__cta {
  font-size: 10px;
  font-weight: 800;
  color: var(--c-accent);
  letter-spacing: .8px;
  text-transform: uppercase;
  opacity: 0;
  transform: translateY(3px);
  transition: opacity .2s, transform .2s;
  margin-top: 2px;
}
.vl-cat-6card:hover .vl-cat-6card__cta { opacity: 1; transform: translateY(0); }

/* ── Fix hero scroll gap ────────────────────────────────────────── */
/* The SCROLL text leaking below the hero was because hero min-height
   was pushing it below the topbar. Fix with proper height calc. */
.vl-hero--v5 {
  min-height: 200px;
}
.vl-hero__scroll {
  bottom: 28px;
}

/* Remove extra space between hero and first section */
body.template-index .vl-section-sm:first-of-type,
body.template-index section:first-of-type {
  margin-top: 0;
}

/* ================================================================
   SPACING FIX — Remove white space, compact hero, 6-col grid
   ================================================================ */

/* Hero: reduce from 100vh to 85vh to eliminate the gap */
body.template-index .vl-hero--v5 {
  min-height: 200px !important;
}

/* Non-homepage: push content below topbar properly */
body:not(.template-index) main#MainContent {
  padding-top: var(--topbar-height, 110px) !important;
}

/* Sections: tighten vertical spacing */
.vl-cat-section { padding: 36px 0 44px !important; }
.vl-section-sm  { padding: 36px 0 !important; }

/* 6-column grid — force correct layout */
.vl-cat-6grid {
  display: grid !important;
  grid-template-columns: repeat(6, 1fr) !important;
  gap: 12px !important;
}
@media (max-width: 1100px) { .vl-cat-6grid { grid-template-columns: repeat(4, 1fr) !important; } }
@media (max-width: 700px)  { .vl-cat-6grid { grid-template-columns: repeat(3, 1fr) !important; gap: 8px !important; } }
@media (max-width: 440px)  { .vl-cat-6grid { grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; } }

/* Compact card height */
.vl-cat-6card__img-wrap {
  aspect-ratio: 1 / 1 !important;
}

/* Override the old large card layout — hide it completely */
.vl-cat-large-row { display: none !important; }
.vl-cat-chips-row { display: none !important; }

/* ================================================================
   PARALLAX V2 + TESTIMONIALS V2
   ================================================================ */

/* ── Parallax V2 ───────────────────────────────────────────────── */
.vl-parallax--v2 { min-height: 620px; }

.vl-parallax__bg--animated {
  position: absolute; inset: -15%; width: 100%; height: 130%;
  background: linear-gradient(135deg, var(--c-dark) 0%, var(--c-dark) 30%, #0f1a35 55%, #1a0e2e 80%, var(--c-dark) 100%);
  background-size: 400% 400%;
  animation: heroGradient 16s ease infinite;
}
.vl-parallax__overlay--img {
  background: linear-gradient(135deg, rgba(10,10,26,.82) 0%, rgba(10,10,26,.5) 100%);
}
.vl-parallax__glow {
  position: absolute; width: 500px; height: 500px; border-radius: 50%;
  pointer-events: none; z-index: 1;
  filter: blur(80px);
}
.vl-parallax__glow--left  { left: -100px; top: 50%; transform: translateY(-50%); background: radial-gradient(circle, rgba(201,169,110,.07), transparent 70%); }
.vl-parallax__glow--right { right: -100px; top: 50%; transform: translateY(-50%); background: radial-gradient(circle, rgba(100,80,180,.06), transparent 70%); }

/* Divider with star */
.vl-parallax__divider {
  display: flex; align-items: center; gap: 12px;
  margin: 18px auto; width: fit-content;
}
.vl-parallax__divider span { display: block; width: 48px; height: 1px; background: linear-gradient(90deg, transparent, var(--c-accent)); }
.vl-parallax__divider span:last-child { background: linear-gradient(90deg, var(--c-accent), transparent); }

/* Button with shimmer */
.vl-parallax__btn {
  position: relative; overflow: hidden;
}
.vl-parallax__btn::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(105deg, transparent 40%, rgba(255,255,255,.25) 50%, transparent 60%);
  transform: translateX(-100%);
  transition: transform .6s;
}
.vl-parallax__btn:hover::after { transform: translateX(100%); }

/* Stats redesign */
.vl-parallax__stats {
  margin-top: 48px; padding-top: 36px;
  border-top: 1px solid rgba(255,255,255,.1);
}
.vl-parallax__stat-inner {
  display: flex; align-items: baseline; justify-content: center; gap: 2px;
  margin-bottom: 6px;
}
.vl-parallax__stat .vl-counter {
  font-size: 48px;
  background: linear-gradient(135deg, var(--c-accent2), var(--c-accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
}
.vl-parallax__stat-suffix {
  font-family: var(--f-head); font-size: 28px; font-weight: 700;
  background: linear-gradient(135deg, var(--c-accent2), var(--c-accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
}
.vl-parallax__stat-label {
  font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase;
  opacity: .55; font-weight: 600;
}

/* Feature pills */
.vl-parallax__features {
  display: flex; align-items: center; justify-content: center;
  gap: 12px; flex-wrap: wrap; margin-top: 28px;
}
.vl-parallax__feature {
  display: flex; align-items: center; gap: 7px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 24px; padding: 8px 16px;
  font-size: 12.5px; font-weight: 600; color: rgba(255,255,255,.85);
  backdrop-filter: blur(4px);
  transition: background .2s, border-color .2s;
}
.vl-parallax__feature:hover { background: rgba(201,169,110,.15); border-color: var(--c-accent-mid); }
.vl-parallax__feature svg { width: 15px; height: 15px; stroke: var(--c-accent); flex-shrink: 0; }

/* Particles */
.vl-parallax__particles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; z-index: 1; }
.vl-parallax__particles span {
  position: absolute; border-radius: 50%;
  background: var(--c-accent); opacity: .1;
  animation: floatParticle linear infinite;
}
.vl-parallax__particles span:nth-child(1) { width:5px;  height:5px;  left:8%;  top:80%; animation-duration:18s; }
.vl-parallax__particles span:nth-child(2) { width:3px;  height:3px;  left:25%; top:60%; animation-duration:22s; animation-delay:2s; }
.vl-parallax__particles span:nth-child(3) { width:7px;  height:7px;  left:40%; top:85%; animation-duration:16s; animation-delay:1s; }
.vl-parallax__particles span:nth-child(4) { width:4px;  height:4px;  left:60%; top:70%; animation-duration:20s; animation-delay:3s; }
.vl-parallax__particles span:nth-child(5) { width:5px;  height:5px;  left:75%; top:90%; animation-duration:24s; animation-delay:.5s; }
.vl-parallax__particles span:nth-child(6) { width:3px;  height:3px;  left:85%; top:75%; animation-duration:17s; animation-delay:4s; }
.vl-parallax__particles span:nth-child(7) { width:6px;  height:6px;  left:15%; top:40%; animation-duration:21s; animation-delay:1.5s; }
.vl-parallax__particles span:nth-child(8) { width:4px;  height:4px;  left:90%; top:55%; animation-duration:19s; animation-delay:2.5s; }

/* ── Testimonials V2 ───────────────────────────────────────────── */
.vl-testimonials-v2 {
  padding: 72px 0;
  background: var(--c-white);
  position: relative;
}
.vl-testimonials-v2::before {
  content: '\201C';
  position: absolute; top: 20px; left: 50%; transform: translateX(-50%);
  font-family: Georgia, serif; font-size: 200px; line-height: 1;
  color: var(--c-accent); opacity: .04; pointer-events: none;
  font-weight: 700;
}

.vl-testimonials-v2__head { text-align: center; margin-bottom: 48px; }
.vl-testimonials-v2__eyebrow {
  font-size: 10px; font-weight: 700; letter-spacing: 3px;
  text-transform: uppercase; color: var(--c-accent); margin-bottom: 8px;
}
.vl-testimonials-v2__title {
  font-family: var(--f-head); font-size: 40px; font-weight: 700;
  margin-bottom: 14px; letter-spacing: -.3px;
}
.vl-testimonials-v2__rating-summary {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  flex-wrap: wrap;
}
.vl-testimonials-v2__stars { display: flex; gap: 3px; }
.vl-testimonials-v2__stars svg { width: 18px; height: 18px; fill: var(--c-accent); }
.vl-testimonials-v2__avg { font-family: var(--f-head); font-size: 20px; font-weight: 700; }
.vl-testimonials-v2__total { font-size: 13px; color: var(--c-muted); }

/* ── Premium 3-card testimonial grid ── */
.vl-test-premium-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 48px;
}
@media (max-width: 900px) { .vl-test-premium-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .vl-test-premium-grid { grid-template-columns: 1fr; } }
.vl-test-premium-card {
  background: var(--c-dark);
  border-radius: 20px;
  padding: 32px 28px 24px;
  display: flex; flex-direction: column; gap: 14px;
  position: relative; overflow: hidden;
  transition: transform .3s ease, box-shadow .3s ease;
}
.vl-test-premium-card::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--c-accent2), var(--c-accent));
}
.vl-test-premium-card:hover { transform: translateY(-5px); box-shadow: 0 20px 50px rgba(0,0,0,.25); }
.vl-test-premium-card__quote {
  font-family: var(--f-head); font-size: 72px; line-height: 0.6;
  color: var(--c-accent); opacity: 0.5; font-weight: 700; margin-bottom: 4px;
}
.vl-test-premium-card__stars { display: flex; gap: 3px; }
.vl-test-premium-card__stars svg { width: 16px; height: 16px; fill: var(--c-accent); flex-shrink: 0; }
.vl-test-premium-card__stars svg.dim { fill: rgba(201,169,110,0.25); }
.vl-test-premium-card__text {
  font-size: 14.5px; line-height: 1.75; color: rgba(255,255,255,0.80);
  flex: 1; margin: 0; font-style: italic;
}
.vl-test-premium-card__author {
  display: flex; align-items: center; gap: 12px;
  padding-top: 16px; border-top: 1px solid rgba(255,255,255,0.10); margin-top: auto;
}
.vl-test-premium-card__avatar {
  width: 40px; height: 40px; border-radius: 50%;
  background: linear-gradient(135deg, var(--c-accent2), var(--c-accent));
  display: flex; align-items: center; justify-content: center;
  font-family: var(--f-head); font-size: 17px; font-weight: 700;
  color: var(--c-dark); flex-shrink: 0;
}
.vl-test-premium-card__info { flex: 1; min-width: 0; }
.vl-test-premium-card__name { font-size: 13px; font-weight: 700; color: #fff; margin: 0; }
.vl-test-premium-card__loc  { font-size: 11.5px; color: rgba(255,255,255,0.45); margin: 2px 0 0; }
.vl-test-premium-card__badge {
  display: flex; align-items: center; gap: 4px;
  font-size: 10px; font-weight: 700; color: #4ade80; white-space: nowrap;
}
.vl-test-premium-card__badge svg { width: 13px; height: 13px; fill: #4ade80; }

/* Grid */
.vl-testimonials-v2__grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
  margin-bottom: 40px;
}
@media (max-width: 900px) { .vl-testimonials-v2__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .vl-testimonials-v2__grid { grid-template-columns: 1fr; } }

/* Review card */
.vl-test-card-v2 {
  background: var(--c-white);
  border: 1.5px solid var(--c-border);
  border-radius: 16px;
  padding: 24px;
  display: flex; flex-direction: column; gap: 10px;
  transition: border-color .25s, box-shadow .25s, transform .25s var(--ease-out);
  position: relative; overflow: hidden;
}
.vl-test-card-v2::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--c-accent2), var(--c-accent));
  opacity: 0; transition: opacity .25s;
}
.vl-test-card-v2:hover {
  border-color: var(--c-accent-mid);
  box-shadow: 0 12px 40px rgba(26,26,46,.08);
  transform: translateY(-3px);
}
.vl-test-card-v2:hover::before { opacity: 1; }

.vl-test-card-v2__top {
  display: flex; align-items: center; justify-content: space-between;
}
.vl-test-card-v2__stars { display: flex; gap: 2px; }
.vl-test-card-v2__star { width: 15px; height: 15px; fill: var(--c-accent); }
.vl-test-card-v2__star--empty { fill: none; stroke: var(--c-border); stroke-width: 1.5; }
.vl-test-card-v2__verified {
  display: flex; align-items: center; gap: 4px;
  font-size: 10.5px; font-weight: 700; color: #27ae60;
}
.vl-test-card-v2__verified svg { width: 14px; height: 14px; fill: #27ae60; }

.vl-test-card-v2__title {
  font-family: var(--f-head); font-size: 16px; font-weight: 700;
  line-height: 1.3; color: var(--c-dark); margin: 0;
}
.vl-test-card-v2__text {
  font-size: 13.5px; line-height: 1.75; color: var(--c-muted); flex: 1;
  margin: 0;
}
.vl-test-card-v2__product {
  display: flex; align-items: center; gap: 6px;
  font-size: 11.5px; font-weight: 600; color: var(--c-accent);
  background: var(--c-accent-light); border-radius: 6px;
  padding: 5px 10px; margin: 0; width: fit-content;
}
.vl-test-card-v2__product svg { width: 12px; height: 12px; stroke: var(--c-accent); flex-shrink: 0; }

.vl-test-card-v2__author {
  display: flex; align-items: center; gap: 10px;
  padding-top: 12px; border-top: 1px solid var(--c-border);
  margin-top: auto;
}
.vl-test-card-v2__avatar {
  width: 38px; height: 38px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--f-head); font-size: 16px; font-weight: 700;
  color: var(--c-dark); border: 1.5px solid var(--c-border);
}
.vl-test-card-v2__info { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; }
.vl-test-card-v2__name { font-size: 13px; font-weight: 700; color: var(--c-dark); }
.vl-test-card-v2__loc  { font-size: 11.5px; color: var(--c-muted); }
.vl-test-card-v2__date { font-size: 11px; color: var(--c-muted); white-space: nowrap; }

/* Footer CTA */
.vl-testimonials-v2__footer { text-align: center; }
.vl-testimonials-v2__cta {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 14px; font-weight: 700; color: var(--c-dark);
  border: 2px solid var(--c-dark); border-radius: 50px;
  padding: 12px 28px; text-decoration: none;
  transition: all .25s var(--ease-out); position: relative; overflow: hidden;
}
.vl-testimonials-v2__cta::before {
  content: ''; position: absolute; inset: 0;
  background: var(--c-dark); transform: translateX(-101%);
  transition: transform .3s var(--ease-out);
}
.vl-testimonials-v2__cta:hover { color: #fff; }
.vl-testimonials-v2__cta:hover::before { transform: translateX(0); }
.vl-testimonials-v2__cta svg, .vl-testimonials-v2__cta span { position: relative; z-index: 1; }
.vl-testimonials-v2__cta svg { width: 16px; transition: transform .2s; }
.vl-testimonials-v2__cta:hover svg { transform: translateX(4px); }

/* ================================================================
   PREMIUM NEWSLETTER V2
   ================================================================ */
.vl-newsletter-v2 {
  position: relative; padding: 80px 24px; overflow: hidden; text-align: center;
}
.vl-newsletter-v2__bg {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, var(--c-dark) 0%, var(--c-dark) 40%, var(--c-dark) 70%, var(--c-dark) 100%);
  background-size: 300% 300%; animation: heroGradient 14s ease infinite;
}
.vl-newsletter-v2__orb {
  position: absolute; border-radius: 50%; pointer-events: none;
  filter: blur(60px);
}
.vl-newsletter-v2__orb--1 { width:400px;height:400px;left:-100px;top:-100px;background:rgba(201,169,110,.06); }
.vl-newsletter-v2__orb--2 { width:300px;height:300px;right:-80px;bottom:-80px;background:rgba(100,80,200,.05); }
.vl-newsletter-v2__orb--3 { width:200px;height:200px;left:50%;top:50%;transform:translate(-50%,-50%);background:rgba(201,169,110,.04); }
.vl-newsletter-v2__particles { position:absolute;inset:0;pointer-events:none;overflow:hidden; }
.vl-newsletter-v2__particles span {
  position:absolute;border-radius:50%;background:var(--c-accent);opacity:.08;
  animation:floatParticle linear infinite;
}
.vl-newsletter-v2__particles span:nth-child(1){width:4px;height:4px;left:10%;top:80%;animation-duration:18s;}
.vl-newsletter-v2__particles span:nth-child(2){width:3px;height:3px;left:30%;top:60%;animation-duration:22s;animation-delay:2s;}
.vl-newsletter-v2__particles span:nth-child(3){width:5px;height:5px;left:60%;top:85%;animation-duration:16s;animation-delay:1s;}
.vl-newsletter-v2__particles span:nth-child(4){width:3px;height:3px;left:80%;top:70%;animation-duration:20s;animation-delay:3s;}
.vl-newsletter-v2__particles span:nth-child(5){width:4px;height:4px;left:45%;top:90%;animation-duration:25s;animation-delay:.5s;}
.vl-newsletter-v2__particles span:nth-child(6){width:3px;height:3px;left:90%;top:40%;animation-duration:19s;animation-delay:4s;}
.vl-newsletter-v2__inner { position:relative;z-index:2;max-width:560px;margin:0 auto;color:#fff; }
.vl-newsletter-v2__icon {
  width:56px;height:56px;border-radius:50%;
  background:rgba(201,169,110,.12);border:1px solid rgba(201,169,110,.25);
  display:flex;align-items:center;justify-content:center;margin:0 auto 20px;
}
.vl-newsletter-v2__icon svg { width:24px;height:24px;stroke:var(--c-accent); }
.vl-newsletter-v2__eyebrow { font-size:10px;font-weight:700;letter-spacing:4px;text-transform:uppercase;color:var(--c-accent);margin-bottom:10px; }
.vl-newsletter-v2__title { font-family:var(--f-head);font-size:44px;font-weight:700;line-height:1.1;letter-spacing:-.5px;margin-bottom:14px; }
.vl-newsletter-v2__sub { font-size:16px;opacity:.7;line-height:1.7;margin-bottom:24px;font-weight:300; }
.vl-newsletter-v2__perks { display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-bottom:28px; }
.vl-newsletter-v2__perk {
  display:flex;align-items:center;gap:6px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);
  border-radius:20px;padding:6px 14px;font-size:12.5px;font-weight:600;
  backdrop-filter:blur(4px);
}
.vl-newsletter-v2__perk svg { width:13px;height:13px;stroke:var(--c-accent);flex-shrink:0; }
.vl-newsletter-v2__form { display:flex;gap:0;border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.06);backdrop-filter:blur(8px);margin-bottom:14px; }
.vl-newsletter-v2__input-wrap { flex:1;display:flex;align-items:center;gap:10px;padding:0 16px; }
.vl-newsletter-v2__input-icon { width:16px;height:16px;stroke:rgba(255,255,255,.4);flex-shrink:0; }
.vl-newsletter-v2__input {
  flex:1;background:none;border:none;outline:none;color:#fff;font-size:15px;
  padding:16px 0;font-family:var(--f-body);
}
.vl-newsletter-v2__input::placeholder { color:rgba(255,255,255,.35); }
.vl-newsletter-v2__btn {
  background:var(--c-accent);color:var(--c-dark);
  padding:0 24px;font-size:13px;font-weight:800;letter-spacing:.8px;
  text-transform:uppercase;display:flex;align-items:center;gap:8px;
  border:none;cursor:pointer;white-space:nowrap;
  transition:background .2s;
}
.vl-newsletter-v2__btn:hover { background:var(--c-accent2); }
.vl-newsletter-v2__btn svg { width:14px;height:14px;stroke:var(--c-dark);transition:transform .2s; }
.vl-newsletter-v2__btn:hover svg { transform:translateX(3px); }
.vl-newsletter-v2__note { display:flex;align-items:center;justify-content:center;gap:6px;font-size:12.5px;opacity:.45;margin-bottom:20px; }
.vl-newsletter-v2__note svg { width:12px;height:12px;stroke:currentColor;flex-shrink:0; }
.vl-newsletter-v2__social-proof { display:flex;align-items:center;justify-content:center;gap:10px; }
.vl-newsletter-v2__avatars { display:flex; }
.vl-newsletter-v2__avatars span {
  width:28px;height:28px;border-radius:50%;border:2px solid rgba(26,26,46,.8);
  display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:700;color:var(--c-dark);margin-left:-6px;
  font-family:var(--f-head);
}
.vl-newsletter-v2__avatars span:first-child { margin-left:0; }
.vl-newsletter-v2__sp-text { font-size:13px;opacity:.55; }
.vl-newsletter-v2__sp-text strong { color:var(--c-accent);opacity:1; }
@media (max-width:540px) { .vl-newsletter-v2__title{font-size:32px;} .vl-newsletter-v2__btn{padding:0 16px;font-size:12px;} }

/* ================================================================
   PREMIUM FOOTER V2 — 30 Improvements
   ================================================================ */
.vl-footer-v2 {
  background: var(--c-footer-bg, var(--c-dark));
  color: var(--c-footer-txt, #e8d5b7);
  position: relative;
}
/* 1. Gold accent top line */
.vl-footer-v2__accent-line {
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--c-accent2) 20%, var(--c-accent) 50%, var(--c-accent2) 80%, transparent 100%);
}
/* 2. Main body */
.vl-footer-v2__body { padding: 32px 0 24px; }
/* 3. Grid layout */
.vl-footer-v2__grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr 1fr 1.2fr;
  gap: 40px;
}
@media (max-width: 1100px) { .vl-footer-v2__grid { grid-template-columns: 1fr 1fr 1fr; } }
@media (max-width: 700px)  { .vl-footer-v2__grid { grid-template-columns: 1fr 1fr; gap: 28px; } }
@media (max-width: 440px)  { .vl-footer-v2__grid { grid-template-columns: 1fr; } }

/* 4. Logo */
.vl-footer-v2__logo { text-decoration: none; display: block; margin-bottom: 8px; }
.vl-footer-v2__logo-name { font-family: var(--f-head); font-size: 16px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--c-footer-txt); display: block; }
.vl-footer-v2__logo-tag  { font-size: 9.5px; letter-spacing: 3px; text-transform: uppercase; color: var(--c-accent); font-weight: 700; }
/* 5. Gold divider */
.vl-footer-v2__brand-line { width: 24px; height: 1.5px; background: var(--c-accent); margin: 8px 0; }
/* 6. Tagline */
.vl-footer-v2__tagline { font-size: 12px; line-height: 1.6; opacity: .55; margin-bottom: 12px; max-width: 220px; }
/* 7. Awards */
.vl-footer-v2__awards { display: none; }
.vl-footer-v2__award {
  display: flex; align-items: center; gap: 10px;
  background: rgba(255,255,255,.04); border: 1px solid rgba(201,169,110,.15);
  border-radius: 8px; padding: 8px 12px;
}
.vl-footer-v2__award svg { width: 18px; height: 18px; stroke: var(--c-accent); flex-shrink: 0; }
.vl-footer-v2__award div { display: flex; flex-direction: column; }
.vl-footer-v2__award span:first-child { font-size: 11.5px; font-weight: 700; color: var(--c-accent); }
.vl-footer-v2__award span:last-child  { font-size: 10.5px; opacity: .5; }
/* 8. Social icons */
.vl-footer-v2__social { display: flex; gap: 8px; }
.vl-footer-v2__social-link {
  width: 34px; height: 34px; border-radius: 8px;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1);
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.5); text-decoration: none;
  transition: all .2s;
}
.vl-footer-v2__social-link svg { width: 15px; height: 15px; }
.vl-footer-v2__social-link:hover { background: var(--c-accent); border-color: var(--c-accent); color: var(--c-dark); }
.vl-footer-v2__social-link:hover svg { stroke: var(--c-dark); fill: var(--c-dark); }
/* 9. Column title */
.vl-footer-v2__col-title {
  font-size: 10px; font-weight: 800; letter-spacing: 2px;
  text-transform: uppercase; color: var(--c-accent);
  margin-bottom: 10px; padding-bottom: 6px;
  border-bottom: 1px solid rgba(201,169,110,.2);
}
/* 10. Links */
.vl-footer-v2__links { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 5px; }
.vl-footer-v2__links li a {
  font-size: 12.5px; color: rgba(232,213,183,.65); text-decoration: none;
  display: flex; align-items: center; gap: 0;
  transition: color .15s, padding-left .15s;
  position: relative; padding-left: 0;
}
.vl-footer-v2__links li a:hover { color: var(--c-accent); padding-left: 8px; }
.vl-footer-v2__links li a::before {
  content: '→'; position: absolute; left: -16px;
  opacity: 0; font-size: 11px; color: var(--c-accent);
  transition: opacity .15s, left .15s;
}
.vl-footer-v2__links li a:hover::before { opacity: 1; left: -2px; }
.vl-footer-v2__links-sale a { color: var(--c-accent) !important; font-weight: 700; }
/* 11. Contact */
.vl-footer-v2__contact-item {
  display: flex; align-items: center; gap: 8px;
  font-size: 12.5px; margin-bottom: 8px; opacity: .6;
  transition: opacity .15s;
}
.vl-footer-v2__contact-item:hover { opacity: 1; }
.vl-footer-v2__contact-item svg { width: 14px; height: 14px; flex-shrink: 0; stroke: var(--c-accent); }
.vl-footer-v2__contact-item a { color: inherit; text-decoration: none; }
.vl-footer-v2__contact-item a:hover { color: var(--c-accent); }
/* 12. Mini newsletter */
.vl-footer-v2__nl-sub { font-size: 12.5px; opacity: .55; margin-bottom: 14px; line-height: 1.6; }
.vl-footer-v2__nl-form {
  display: flex; border-radius: 8px; overflow: hidden;
  border: 1px solid rgba(255,255,255,.12); margin-bottom: 18px;
}
.vl-footer-v2__nl-input {
  flex: 1; background: rgba(255,255,255,.05); border: none; outline: none;
  padding: 10px 14px; font-size: 13px; color: #fff; font-family: var(--f-body);
}
.vl-footer-v2__nl-input::placeholder { color: rgba(255,255,255,.3); }
.vl-footer-v2__nl-btn {
  background: var(--c-accent); border: none; padding: 0 14px;
  cursor: pointer; display: flex; align-items: center; transition: background .15s;
}
.vl-footer-v2__nl-btn svg { width: 16px; height: 16px; stroke: var(--c-dark); }
.vl-footer-v2__nl-btn:hover { background: var(--c-accent2); }
/* 13. Trust mini badges */
.vl-footer-v2__trust { display: flex; flex-direction: column; gap: 7px; }
.vl-footer-v2__trust-item {
  display: flex; align-items: center; gap: 7px;
  font-size: 12px; opacity: .5;
}
.vl-footer-v2__trust-item svg { width: 13px; height: 13px; stroke: var(--c-accent); flex-shrink: 0; }
/* 14. Payment strip */
.vl-footer-v2__payments {
  border-top: 1px solid rgba(255,255,255,.07);
  padding: 18px 0;
}
.vl-footer-v2__payments-inner {
  display: flex; align-items: center; justify-content: center;
  gap: 16px; flex-wrap: wrap;
}
.vl-footer-v2__payments-label { font-size: 10px; text-transform: uppercase; letter-spacing: 2px; opacity: .35; }
.vl-footer-v2__payment-icons { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.vl-pay-icon-v2 {
  display: flex; align-items: center; gap: 5px;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
  border-radius: 6px; padding: 5px 10px;
  font-size: 10px; font-weight: 700; letter-spacing: .5px; opacity: .6;
  transition: opacity .15s;
}
.vl-pay-icon-v2:hover { opacity: 1; }
.vl-pay-icon-v2 svg { width: 24px; height: 16px; }
/* 15. Bottom bar */
.vl-footer-v2__bottom {
  border-top: 1px solid rgba(255,255,255,.07);
  padding: 16px 0;
}
.vl-footer-v2__bottom-inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; flex-wrap: wrap;
}
.vl-footer-v2__copy { font-size: 12px; opacity: .4; }
.vl-footer-v2__legal-links { display: flex; gap: 16px; }
.vl-footer-v2__legal-links a { font-size: 12px; color: inherit; opacity: .4; text-decoration: none; transition: opacity .15s; }
.vl-footer-v2__legal-links a:hover { opacity: .8; }
.vl-footer-v2__made { display: flex; align-items: center; gap: 5px; font-size: 11.5px; opacity: .35; }
@media (max-width: 640px) { .vl-footer-v2__bottom-inner { flex-direction: column; align-items: flex-start; gap: 8px; } }

/* ================================================================
   PREMIUM 3D BUBBLE BOTTOM NAV
   ================================================================ */

/* Remove old bottom nav styles */
.vl-bottom-nav { display: none !important; }

.vl-bnav {
  display: none;
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 350;
  padding: 6px 10px 8px;
  padding-bottom: calc(8px + env(safe-area-inset-bottom));
  background: transparent;
  pointer-events: none;
}
@media (max-width: 768px) { .vl-bnav { display: block; } }

/* Glassmorphism pill container */
.vl-bnav__track {
  display: flex;
  align-items: center;
  justify-content: space-around;
  background: rgba(26, 26, 46, 0.82);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid rgba(201, 169, 110, 0.18);
  border-radius: 28px;
  padding: 5px 4px;
  pointer-events: all;
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.35),
    0 2px 8px rgba(0, 0, 0, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.07);
  position: relative;
  overflow: hidden;
}
/* Inner shimmer */
.vl-bnav__track::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(201,169,110,.04) 0%, transparent 50%, rgba(201,169,110,.03) 100%);
  pointer-events: none;
}

/* Each nav item */
.vl-bnav__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  text-decoration: none;
  flex: 1;
  -webkit-tap-highlight-color: transparent;
}

/* Bubble wrapper */
.vl-bnav__bubble {
  position: relative;
  width: 38px; height: 38px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 12px;
  transition: all .3s cubic-bezier(.34, 1.56, .64, 1);
  background: transparent;
}

/* Icon */
.vl-bnav__icon {
  width: 19px; height: 19px;
  fill: none;
  stroke: rgba(255,255,255,.38);
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: stroke .25s, transform .3s cubic-bezier(.34, 1.56, .64, 1);
}

/* Label */
.vl-bnav__label {
  font-size: 8.5px;
  font-weight: 600;
  letter-spacing: .5px;
  text-transform: uppercase;
  color: rgba(255,255,255,.3);
  transition: color .25s;
}

/* ── Active state — 3D gold bubble ── */
.vl-bnav__item.active .vl-bnav__bubble {
  background: linear-gradient(145deg, #d4aa6e, #c9a96e, #a8845a);
  box-shadow:
    0 6px 20px rgba(201,169,110,.5),
    0 2px 6px rgba(201,169,110,.3),
    inset 0 1px 0 rgba(255,255,255,.35),
    inset 0 -2px 4px rgba(0,0,0,.2);
  transform: translateY(-3px) scale(1.06);
}
.vl-bnav__item.active .vl-bnav__icon {
  stroke: var(--c-dark);
  transform: scale(1.05);
}
.vl-bnav__item.active .vl-bnav__label {
  color: var(--c-accent);
  font-weight: 800;
}

/* ── Tap animation ── */
.vl-bnav__item:active .vl-bnav__bubble {
  transform: translateY(-2px) scale(0.94);
}

/* ── Center search button — larger premium pill ── */
.vl-bnav__item--center .vl-bnav__bubble--center {
  width: 44px; height: 44px;
  border-radius: 14px;
  background: linear-gradient(145deg, #d4aa6e, #c9a96e, #a8845a);
  box-shadow:
    0 8px 24px rgba(201,169,110,.45),
    0 2px 8px rgba(201,169,110,.25),
    inset 0 1px 0 rgba(255,255,255,.4),
    inset 0 -3px 6px rgba(0,0,0,.2);
  transform: translateY(-6px);
}
.vl-bnav__item--center .vl-bnav__icon {
  stroke: var(--c-dark);
  width: 19px; height: 19px;
}
.vl-bnav__item--center:active .vl-bnav__bubble--center {
  transform: translateY(-4px) scale(0.92);
}
.vl-bnav__item--center .vl-bnav__label { color: var(--c-accent); font-weight: 700; }

/* ── Cart badge ── */
.vl-bnav__badge {
  position: absolute;
  top: 6px; right: 6px;
  min-width: 16px; height: 16px;
  background: #c0392b;
  color: #fff;
  border-radius: 8px;
  padding: 0 4px;
  font-size: 9px;
  font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  border: 1.5px solid rgba(26,26,46,.8);
  box-shadow: 0 2px 6px rgba(192,57,43,.5);
  animation: cartBounce .4s cubic-bezier(.34, 1.56, .64, 1);
}

/* ── Hover on desktop-size touch targets ── */
@media (hover: hover) {
  .vl-bnav__item:not(.active):hover .vl-bnav__bubble {
    background: rgba(255,255,255,.08);
    transform: translateY(-2px);
  }
  .vl-bnav__item:not(.active):hover .vl-bnav__icon { stroke: rgba(255,255,255,.7); }
  .vl-bnav__item:not(.active):hover .vl-bnav__label { color: rgba(255,255,255,.6); }
}

/* Push content up */
@media (max-width: 768px) {
  main#MainContent { padding-bottom: 72px; }
  .vl-sticky-atc    { bottom: 68px; }
  .vl-back-top      { bottom: 76px; right: 16px; }
  .vl-whatsapp      { bottom: 80px; right: 16px; }
}

/* Track Order nav link style */
.vl-nav-link--track {
  display: flex; align-items: center; gap: 5px;
  color: var(--c-accent) !important;
  font-weight: 600;
}

/* ================================================================
   9 PREMIUM HOMEPAGE FEATURES
   ================================================================ */

/* ── #30: Premium Loading Screen ───────────────────────────────── */
.vl-loader {
  position: fixed; inset: 0; z-index: 99999;
  background: var(--c-dark);
  display: flex; align-items: center; justify-content: center;
  transition: opacity .5s ease, visibility .5s;
}
.vl-loader.hidden { opacity: 0; visibility: hidden; pointer-events: none; }
.vl-loader__inner { text-align: center; }
.vl-loader__logo { margin-bottom: 28px; }
.vl-loader__logo-name {
  display: block;
  font-family: var(--f-head); font-size: 38px; font-weight: 700;
  letter-spacing: 8px; text-transform: uppercase; color: #fff;
  animation: loaderFade 1.2s ease forwards;
}
.vl-loader__logo-sub {
  display: block;
  font-size: 11px; letter-spacing: 6px; text-transform: uppercase;
  color: var(--c-accent); margin-top: 4px; font-weight: 700;
  animation: loaderFade 1.2s .2s ease forwards; opacity: 0;
}
@keyframes loaderFade { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:none} }
.vl-loader__bar {
  width: 180px; height: 2px; background: rgba(255,255,255,.1);
  border-radius: 1px; overflow: hidden; margin: 0 auto 16px;
}
.vl-loader__fill {
  height: 100%;
  background: linear-gradient(90deg, var(--c-accent2), var(--c-accent));
  width: 0; transition: width 1.2s cubic-bezier(.4,0,.2,1);
  box-shadow: 0 0 8px var(--c-accent);
}
.vl-loader__tagline {
  font-size: 11px; color: rgba(255,255,255,.3);
  letter-spacing: 2px; text-transform: uppercase;
  animation: loaderFade 1s .4s ease forwards; opacity: 0;
}

/* ── #3: Animated Text Reveal ──────────────────────────────────── */
.vl-text-reveal .vl-text-reveal__letter {
  display: inline-block;
  opacity: 0; transform: translateY(20px);
  animation: letterReveal .5s var(--ease-out) forwards;
}
@keyframes letterReveal {
  to { opacity: 1; transform: translateY(0); }
}

/* ── #22: Bestseller Rank Badge ────────────────────────────────── */
.vl-badge-rank {
  background: linear-gradient(135deg, var(--c-dark), #2d2d4e) !important;
  color: var(--c-accent) !important;
  border: 1px solid var(--c-accent-mid);
  font-size: 9px !important;
  letter-spacing: .5px;
}

/* ── #18: Review Ticker ────────────────────────────────────────── */
.vl-review-ticker {
  background: var(--c-bg2);
  padding: 20px 0;
  overflow: hidden;
  border-top: 1px solid var(--c-border);
  border-bottom: 1px solid var(--c-border);
}
.vl-review-ticker__track {
  display: flex; gap: 0;
  animation: reviewTicker 60s linear infinite;
  width: max-content;
}
.vl-review-ticker:hover .vl-review-ticker__track { animation-play-state: paused; }
@keyframes reviewTicker { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
.vl-review-ticker__item {
  display: flex; align-items: center; gap: 12px;
  padding: 0 36px;
  border-right: 1px solid var(--c-border);
  white-space: nowrap; flex-shrink: 0;
}
.vl-review-ticker__stars { display: flex; gap: 2px; flex-shrink: 0; }
.vl-review-ticker__stars svg { width: 12px; height: 12px; fill: var(--c-accent); }
.vl-review-ticker__text { font-size: 13px; color: var(--c-text); font-style: italic; }
.vl-review-ticker__author { font-size: 12px; color: var(--c-muted); font-weight: 600; white-space: nowrap; }

/* ── #16: Instagram Feed ───────────────────────────────────────── */
.vl-instagram-section { padding: 64px 0; }
.vl-instagram-section__head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 28px; flex-wrap: wrap; gap: 12px;
}
.vl-instagram-section__eyebrow {
  font-size: 10px; font-weight: 700; letter-spacing: 3px;
  text-transform: uppercase; color: var(--c-accent); margin-bottom: 4px;
}
.vl-instagram-section__title {
  font-family: var(--f-head); font-size: 28px; font-weight: 700;
  display: flex; align-items: center; gap: 8px;
}
.vl-instagram-section__follow {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 700; color: var(--c-dark);
  border: 1.5px solid var(--c-dark); border-radius: 24px;
  padding: 9px 20px; text-decoration: none; transition: all .2s;
}
.vl-instagram-section__follow:hover { background: var(--c-dark); color: #fff; }
.vl-instagram-section__follow svg { width: 14px; }
.vl-instagram-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 4px;
}
@media (max-width: 900px) { .vl-instagram-grid { grid-template-columns: repeat(3,1fr); } }
@media (max-width: 540px) { .vl-instagram-grid { grid-template-columns: repeat(2,1fr); } }
.vl-instagram-item {
  position: relative; aspect-ratio: 1; overflow: hidden;
  border-radius: 8px; background: var(--c-bg2);
  display: block; text-decoration: none;
}
.vl-instagram-item--large { grid-column: span 2; grid-row: span 1; }
.vl-instagram-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease-out); }
.vl-instagram-item:hover img { transform: scale(1.08); }
.vl-instagram-item__overlay {
  position: absolute; inset: 0;
  background: rgba(26,26,46,.7);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  opacity: 0; transition: opacity .3s;
}
.vl-instagram-item:hover .vl-instagram-item__overlay { opacity: 1; }
.vl-instagram-item__icon svg { width: 28px; stroke: #fff; }
.vl-instagram-item__shop {
  background: var(--c-accent); color: var(--c-dark);
  font-size: 11px; font-weight: 800; letter-spacing: .8px;
  text-transform: uppercase; padding: 6px 14px; border-radius: 20px;
}
.vl-instagram-item__caption { font-size: 12px; color: rgba(255,255,255,.8); text-align: center; padding: 0 12px; }
.vl-instagram-item__placeholder {
  width: 100%; height: 100%;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  color: var(--c-muted); font-size: 12px;
}
.vl-instagram-item__placeholder svg { width: 28px; stroke: var(--c-border); }

/* ── #20: Trust Stats Counter ──────────────────────────────────── */
.vl-trust-stats { position: relative; padding: 64px 0; overflow: hidden; }
.vl-trust-stats__bg {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, var(--c-dark) 0%, var(--c-dark) 50%, var(--c-dark) 100%);
  background-size: 300% 300%; animation: heroGradient 16s ease infinite;
}
.vl-trust-stats__grid {
  position: relative; z-index: 2;
  display: grid; grid-template-columns: repeat(4,1fr); gap: 2px;
}
@media (max-width: 768px) { .vl-trust-stats__grid { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 420px) { .vl-trust-stats__grid { grid-template-columns: 1fr 1fr; } }
.vl-trust-stats__item {
  text-align: center; padding: 36px 20px;
  border-right: 1px solid rgba(255,255,255,.07);
  display: flex; flex-direction: column; align-items: center; gap: 6px;
}
.vl-trust-stats__item:last-child { border-right: none; }
@media (max-width: 768px) {
  .vl-trust-stats__item:nth-child(2) { border-right: none; }
  .vl-trust-stats__item:nth-child(odd) { border-right: 1px solid rgba(255,255,255,.07); }
}
.vl-trust-stats__icon {
  width: 44px; height: 44px; border-radius: 12px;
  background: rgba(201,169,110,.1); border: 1px solid rgba(201,169,110,.2);
  display: flex; align-items: center; justify-content: center; margin-bottom: 8px;
}
.vl-trust-stats__icon svg { width: 20px; stroke: var(--c-accent); }
.vl-trust-stats__num-wrap { display: flex; align-items: baseline; gap: 2px; }
.vl-trust-stats__num {
  font-family: var(--f-head); font-size: 42px; font-weight: 800;
  background: linear-gradient(135deg, var(--c-accent2), var(--c-accent));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.vl-trust-stats__suffix { font-family: var(--f-head); font-size: 26px; font-weight: 700; color: var(--c-accent); }
.vl-trust-stats__label { font-size: 13px; font-weight: 700; color: rgba(255,255,255,.8); text-transform: uppercase; letter-spacing: .5px; }
.vl-trust-stats__sub { font-size: 11.5px; color: rgba(255,255,255,.35); }

/* ── #24: Flash Sale (already exists in vl_countdown_sale, style boost) ─ */
.vl-countdown-banner { background-size: 300% 300%; animation: heroGradient 14s ease infinite; }

/* ── #25: Style Finder Quiz ────────────────────────────────────── */
.vl-quiz-section { padding: 72px 0; }
.vl-quiz-section__head { text-align: center; margin-bottom: 36px; }
.vl-quiz-section__eyebrow { font-size: 10px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 8px; }
.vl-quiz-section__title { font-family: var(--f-head); font-size: 40px; font-weight: 700; margin-bottom: 10px; }
.vl-quiz-section__sub { font-size: 15px; color: var(--c-muted); }
.vl-quiz {
  background: var(--c-white); border: 1.5px solid var(--c-border);
  border-radius: 20px; padding: 36px; max-width: 600px; margin: 0 auto;
  box-shadow: 0 8px 40px rgba(0,0,0,.06);
}
.vl-quiz__step { display: none; }
.vl-quiz__step.active { display: block; animation: quizStepIn .35s var(--ease-out); }
@keyframes quizStepIn { from{opacity:0;transform:translateX(20px)} to{opacity:1;transform:none} }
.vl-quiz__question { font-size: 17px; font-weight: 700; margin-bottom: 20px; color: var(--c-dark); }
.vl-quiz__options { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 20px; }
.vl-quiz__opt {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 16px; border-radius: 12px;
  border: 1.5px solid var(--c-border); background: var(--c-white);
  cursor: pointer; text-align: left; transition: all .2s;
  font-family: var(--f-body);
}
.vl-quiz__opt:hover { border-color: var(--c-accent); background: var(--c-accent-light); }
.vl-quiz__opt.selected { border-color: var(--c-accent); background: var(--c-accent-light); box-shadow: 0 0 0 3px rgba(201,169,110,.15); }
.vl-quiz__opt-icon { font-size: 22px; flex-shrink: 0; }
.vl-quiz__opt-label { font-size: 13.5px; font-weight: 600; }
.vl-quiz__progress {
  height: 3px; background: var(--c-border); border-radius: 2px; overflow: hidden;
}
.vl-quiz__progress-fill {
  height: 100%; background: linear-gradient(90deg, var(--c-accent2), var(--c-accent));
  transition: width .4s var(--ease-out); border-radius: 2px;
}
.vl-quiz__result { text-align: center; animation: quizStepIn .4s var(--ease-out); padding: 12px 0; }
.vl-quiz__result-icon { font-size: 48px; margin-bottom: 12px; }
.vl-quiz__result-title { font-family: var(--f-head); font-size: 26px; font-weight: 700; margin-bottom: 10px; }
.vl-quiz__result-text { font-size: 14px; color: var(--c-muted); line-height: 1.65; margin-bottom: 20px; }
.vl-quiz__result-actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

/* ── #28: Color Palette Filter ─────────────────────────────────── */
.vl-color-filter-bar {
  display: flex; align-items: center; justify-content: center;
  gap: 10px; flex-wrap: wrap; padding: 16px 0 8px; margin-bottom: 8px;
}
.vl-color-filter-btn {
  width: 28px; height: 28px; border-radius: 50%;
  border: 2.5px solid transparent; cursor: pointer;
  box-shadow: 0 0 0 1px rgba(0,0,0,.12);
  transition: all .18s; position: relative;
}
.vl-color-filter-btn:hover, .vl-color-filter-btn.active {
  box-shadow: 0 0 0 2px var(--c-white), 0 0 0 4px var(--c-dark);
  transform: scale(1.15);
}
.vl-color-filter-btn[data-color="all"] {
  background: conic-gradient(#c4a882, var(--c-dark), #f8f8f0, #c0392b, #27ae60, #c4a882);
  width: 32px; height: 32px;
}
.vl-color-filter-btn.active::after {
  content: '✓'; position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 900; color: #fff;
  text-shadow: 0 1px 2px rgba(0,0,0,.6);
}
.vl-color-filter-label { font-size: 10px; text-align: center; margin-top: 4px; color: var(--c-muted); font-weight: 600; display: block; }

/* ── #26: Enhanced Smooth Scroll Animations ────────────────────── */
[data-reveal] { opacity: 0; transition: opacity .7s var(--ease-out), transform .7s var(--ease-out); }
[data-reveal="up"]    { transform: translateY(36px); }
[data-reveal="left"]  { transform: translateX(36px); }
[data-reveal="right"] { transform: translateX(-36px); }
[data-reveal="scale"] { transform: scale(.9); }
[data-reveal="fade"]  { transform: none; }
[data-reveal].revealed { opacity: 1; transform: none !important; }
[data-reveal-delay="1"] { transition-delay: .08s; }
[data-reveal-delay="2"] { transition-delay: .16s; }
[data-reveal-delay="3"] { transition-delay: .24s; }
[data-reveal-delay="4"] { transition-delay: .32s; }
[data-reveal-delay="5"] { transition-delay: .40s; }
[data-reveal-delay="6"] { transition-delay: .48s; }

/* Compact hero overrides */
.vl-hero--v5 .vl-hero__eyebrow { font-size: 9px; margin-bottom: 8px; }
.vl-hero--v5 .vl-hero__title   { font-size: 38px; line-height: 1.1; margin-bottom: 10px; }
.vl-hero--v5 .vl-hero__subtitle { font-size: 13px; margin-bottom: 16px; line-height: 1.5; }
.vl-hero--v5 .vl-hero__btns    { gap: 8px; margin-bottom: 0; }
.vl-hero--v5 .vl-hero__stats   { margin-top: 14px; padding-top: 12px; gap: 16px; }
.vl-hero--v5 .vl-hero__stat-num { font-size: 22px; }
.vl-hero--v5 .vl-hero__stat-label { font-size: 9px; }

@media (max-width: 768px) {
  .vl-hero--v5 .vl-hero__title    { font-size: 30px; }
  .vl-hero--v5 .vl-hero__subtitle { font-size: 12.5px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .vl-hero--v5 .vl-hero__stats    { display: none; }
  .vl-hero__btn { padding: 12px 20px; font-size: 12px; }
}

/* ── DEFINITIVE HERO SIZE OVERRIDE ───────────────────── */
.vl-hero,
.vl-hero--v5,
body.template-index .vl-hero--v5 {
  min-height: 200px !important;
  max-height: 340px;
}
@media (max-width: 768px) {
  .vl-hero,
  .vl-hero--v5,
  body.template-index .vl-hero--v5 {
    min-height: 160px !important;
    max-height: 280px;
  }
}

/* ================================================================
   8 NEW PREMIUM FEATURES
   ================================================================ */

/* ── #8: Press Bar ─────────────────────────────────────────────── */
.vl-press-bar {
  border-top: 1px solid var(--c-border);
  border-bottom: 1px solid var(--c-border);
  padding: 18px 0; background: var(--c-white);
}
.vl-press-bar__inner {
  display: flex; align-items: center; justify-content: center;
  gap: 24px; flex-wrap: wrap; max-width: 1200px; margin: 0 auto; padding: 0 24px;
}
.vl-press-bar__label {
  font-size: 9px; font-weight: 800; letter-spacing: 3px;
  text-transform: uppercase; color: var(--c-muted); white-space: nowrap;
}
.vl-press-bar__logos {
  display: flex; align-items: center; gap: 32px; flex-wrap: wrap; justify-content: center;
}
.vl-press-bar__text {
  font-family: var(--f-head); font-size: 18px; font-weight: 700;
  color: var(--c-muted); opacity: .45; letter-spacing: 1px;
  font-style: italic; transition: opacity .2s;
}
.vl-press-bar__text:hover { opacity: .8; }
.vl-press-bar__img {
  height: 22px; width: auto; object-fit: contain;
  filter: grayscale(1); opacity: .35; transition: all .2s;
}
.vl-press-bar__img:hover { filter: grayscale(0); opacity: .9; }

/* ── #1: Horizontal Product Carousel ──────────────────────────── */
.vl-carousel-section { padding: 56px 0; }
.vl-carousel-section .vl-sec-head { padding: 0 24px; margin-bottom: 24px; }
.vl-carousel-wrap { position: relative; }
.vl-carousel {
  display: flex; gap: 16px; overflow-x: auto;
  scroll-snap-type: x mandatory; scrollbar-width: none;
  padding: 8px 24px 16px; cursor: grab;
}
.vl-carousel::-webkit-scrollbar { display: none; }
.vl-carousel:active { cursor: grabbing; }
.vl-carousel .vl-card {
  flex: 0 0 220px; scroll-snap-align: start;
  min-width: 220px;
}
@media (max-width: 768px) { .vl-carousel .vl-card { flex: 0 0 170px; min-width: 170px; } }
.vl-carousel-arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--c-white); border: 1.5px solid var(--c-border);
  box-shadow: 0 4px 16px rgba(0,0,0,.1);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; z-index: 4; transition: all .2s;
}
.vl-carousel-arrow:hover { background: var(--c-dark); border-color: var(--c-dark); }
.vl-carousel-arrow:hover svg { stroke: #fff; }
.vl-carousel-arrow svg { width: 18px; height: 18px; stroke: var(--c-dark); fill: none; stroke-width: 2; }
.vl-carousel-arrow--prev { left: 4px; }
.vl-carousel-arrow--next { right: 4px; }
@media (max-width: 768px) { .vl-carousel-arrow { display: none; } }

/* ── #6: Live Visitor Counter ──────────────────────────────────── */
.vl-visitor-counter {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(26,26,46,.06); border: 1px solid var(--c-border);
  border-radius: 24px; padding: 6px 14px;
  font-size: 12.5px; font-weight: 600; color: var(--c-text);
  position: fixed; bottom: 80px; left: 16px; z-index: 200;
  backdrop-filter: blur(8px); box-shadow: 0 4px 20px rgba(0,0,0,.1);
  transition: opacity .3s; opacity: 0; pointer-events: none;
}
.vl-visitor-counter.visible { opacity: 1; pointer-events: auto; }
.vl-visitor-counter__dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #27ae60; flex-shrink: 0;
  box-shadow: 0 0 0 2px rgba(39,174,96,.2);
  animation: visitorPulse 2s ease infinite;
}
@keyframes visitorPulse {
  0%,100% { box-shadow: 0 0 0 2px rgba(39,174,96,.2); }
  50%      { box-shadow: 0 0 0 5px rgba(39,174,96,.05); }
}
@media (max-width: 768px) { .vl-visitor-counter { bottom: 88px; left: 12px; font-size: 11.5px; } }

/* ── #2: Staff Picks ───────────────────────────────────────────── */
.vl-staff-picks { padding: 64px 0; background: var(--c-bg2); }
.vl-staff-picks__head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 20px; margin-bottom: 36px; flex-wrap: wrap;
}
.vl-staff-picks__eyebrow { font-size: 10px; font-weight: 800; letter-spacing: 3px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 6px; }
.vl-staff-picks__title   { font-family: var(--f-head); font-size: 36px; font-weight: 700; }
.vl-staff-picks__note    { font-size: 14px; color: var(--c-muted); max-width: 260px; text-align: right; line-height: 1.6; }
@media (max-width: 640px) { .vl-staff-picks__note { text-align: left; } }
.vl-staff-picks__grid    { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
@media (max-width: 900px) { .vl-staff-picks__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 540px) { .vl-staff-picks__grid { grid-template-columns: 1fr; } }
.vl-staff-pick {
  background: var(--c-white); border-radius: 16px; overflow: hidden;
  border: 1.5px solid var(--c-border);
  transition: box-shadow .25s, transform .25s var(--ease-out), border-color .25s;
}
.vl-staff-pick:hover { box-shadow: 0 12px 40px rgba(0,0,0,.1); transform: translateY(-4px); border-color: var(--c-accent-mid); }
.vl-staff-pick__img-wrap { position: relative; aspect-ratio: 4/3; overflow: hidden; background: var(--c-bg2); }
.vl-staff-pick__img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease-out); }
.vl-staff-pick:hover .vl-staff-pick__img-wrap img { transform: scale(1.06); }
.vl-staff-pick__badge {
  position: absolute; top: 12px; right: 12px;
  background: var(--c-dark); color: var(--c-accent);
  font-size: 9px; font-weight: 800; letter-spacing: 1px;
  text-transform: uppercase; padding: 4px 10px; border-radius: 20px;
  border: 1px solid var(--c-accent-mid);
}
.vl-staff-pick__info { padding: 20px; }
.vl-staff-pick__staff { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.vl-staff-pick__avatar {
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--c-accent-light); border: 1.5px solid var(--c-accent-mid);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--f-head); font-size: 14px; font-weight: 700; color: var(--c-dark); flex-shrink: 0;
}
.vl-staff-pick__staff-name  { display: block; font-size: 12.5px; font-weight: 700; color: var(--c-dark); }
.vl-staff-pick__staff-role  { display: block; font-size: 11px; color: var(--c-muted); }
.vl-staff-pick__product-name { font-family: var(--f-head); font-size: 18px; font-weight: 700; margin-bottom: 8px; }
.vl-staff-pick__quote { font-size: 13px; color: var(--c-muted); font-style: italic; line-height: 1.6; margin-bottom: 14px; }
.vl-staff-pick__footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 12px; border-top: 1px solid var(--c-border); }
.vl-staff-pick__price { font-family: var(--f-head); font-size: 20px; font-weight: 700; color: var(--c-dark); }
.vl-staff-pick__cta {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--c-dark); color: #fff;
  font-size: 11.5px; font-weight: 700; letter-spacing: .5px;
  padding: 8px 16px; border-radius: 24px; text-decoration: none;
  transition: background .2s;
}
.vl-staff-pick__cta:hover { background: var(--c-accent); color: var(--c-dark); }

/* ── #12: Flash Sale ───────────────────────────────────────────── */
.vl-flash-sale { position: relative; padding: 56px 0; overflow: hidden; }
.vl-flash-sale__bg {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, var(--c-dark) 0%, var(--c-dark) 50%, #0f1520 100%);
  background-size: 300% 300%; animation: heroGradient 16s ease infinite;
}
.vl-flash-sale__inner {
  position: relative; z-index: 2;
  display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center;
}
@media (max-width: 768px) { .vl-flash-sale__inner { grid-template-columns: 1fr; } }
.vl-flash-sale__eyebrow {
  display: flex; align-items: center; gap: 8px;
  font-size: 10px; font-weight: 800; letter-spacing: 3px;
  text-transform: uppercase; color: var(--c-accent); margin-bottom: 10px;
}
.vl-flash-sale__dot {
  width: 8px; height: 8px; border-radius: 50%; background: #e53935;
  animation: visitorPulse 1.5s ease infinite; flex-shrink: 0;
}
.vl-flash-sale__title { font-family: var(--f-head); font-size: 48px; font-weight: 700; color: #fff; margin-bottom: 10px; }
.vl-flash-sale__sub   { font-size: 15px; color: rgba(255,255,255,.6); margin-bottom: 24px; line-height: 1.6; }
.vl-flash-sale__timer { display: flex; align-items: center; gap: 8px; margin-bottom: 28px; }
.vl-flash-unit        { text-align: center; }
.vl-flash-num {
  display: block; font-family: var(--f-head); font-size: 40px; font-weight: 800;
  color: var(--c-accent); background: rgba(255,255,255,.06);
  border: 1px solid rgba(201,169,110,.2); border-radius: 10px;
  padding: 8px 14px; min-width: 56px; line-height: 1;
}
.vl-flash-label { display: block; font-size: 9px; text-transform: uppercase; letter-spacing: 1.5px; color: rgba(255,255,255,.4); margin-top: 5px; font-weight: 700; }
.vl-flash-sep   { font-family: var(--f-head); font-size: 32px; color: var(--c-accent); padding-bottom: 18px; opacity: .6; }
.vl-flash-sale__btn {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--c-accent); color: var(--c-dark);
  font-size: 13px; font-weight: 800; letter-spacing: .8px; text-transform: uppercase;
  padding: 14px 28px; border-radius: 8px; text-decoration: none;
  transition: background .2s, transform .2s;
}
.vl-flash-sale__btn:hover { background: var(--c-accent2); transform: translateY(-2px); }
.vl-flash-sale__btn svg { width: 16px; transition: transform .2s; }
.vl-flash-sale__btn:hover svg { transform: translateX(4px); }
.vl-flash-sale__products { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
.vl-flash-prod {
  width: 130px; text-decoration: none; color: #fff;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1);
  border-radius: 12px; overflow: hidden; transition: all .2s;
}
.vl-flash-prod:hover { background: rgba(255,255,255,.1); transform: translateY(-3px); }
.vl-flash-prod__img { position: relative; aspect-ratio: 1; overflow: hidden; }
.vl-flash-prod__img img { width: 100%; height: 100%; object-fit: cover; }
.vl-flash-prod__badge {
  position: absolute; top: 6px; left: 6px;
  background: #e53935; color: #fff;
  font-size: 9px; font-weight: 900; padding: 3px 7px; border-radius: 20px;
}
.vl-flash-prod__info { padding: 10px; }
.vl-flash-prod__name { display: block; font-size: 11.5px; font-weight: 600; margin-bottom: 4px; line-height: 1.3; }
.vl-flash-prod__prices { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.vl-flash-prod__price   { font-family: var(--f-head); font-size: 14px; font-weight: 700; color: var(--c-accent); }
.vl-flash-prod__compare { font-size: 11px; color: rgba(255,255,255,.35); text-decoration: line-through; }
@media (max-width: 768px) { .vl-flash-sale__title { font-size: 36px; } .vl-flash-num { font-size: 28px; min-width: 44px; } }

/* ── #13: Bundle Deal ──────────────────────────────────────────── */
.vl-bundle { padding: 64px 0; }
.vl-bundle__head { text-align: center; margin-bottom: 36px; }
.vl-bundle__eyebrow { font-size: 10px; font-weight: 800; letter-spacing: 3px; text-transform: uppercase; color: var(--c-accent); margin-bottom: 8px; }
.vl-bundle__title   { font-family: var(--f-head); font-size: 40px; font-weight: 700; margin-bottom: 10px; }
.vl-bundle__sub     { font-size: 15px; color: var(--c-muted); max-width: 480px; margin: 0 auto; }
.vl-bundle__deals   { display: grid; grid-template-columns: repeat(2,1fr); gap: 20px; }
@media (max-width: 768px) { .vl-bundle__deals { grid-template-columns: 1fr; } }
.vl-bundle__deal {
  background: var(--c-white); border: 1.5px solid var(--c-border);
  border-radius: 16px; overflow: hidden; display: flex; flex-direction: column;
  transition: box-shadow .25s, border-color .25s, transform .25s;
}
.vl-bundle__deal:hover { box-shadow: 0 12px 40px rgba(0,0,0,.08); border-color: var(--c-accent-mid); transform: translateY(-3px); }
.vl-bundle__deal-imgs { display: flex; align-items: center; gap: 0; background: var(--c-bg2); }
.vl-bundle__deal-img  { flex: 1; aspect-ratio: 1; overflow: hidden; }
.vl-bundle__deal-img img { width: 100%; height: 100%; object-fit: cover; }
.vl-bundle__plus {
  font-family: var(--f-head); font-size: 28px; font-weight: 700; color: var(--c-accent);
  padding: 0 12px; flex-shrink: 0; background: var(--c-bg2);
}
.vl-bundle__deal-info  { padding: 20px; }
.vl-bundle__deal-save  { display: inline-block; background: var(--c-accent); color: var(--c-dark); font-size: 10px; font-weight: 900; letter-spacing: 1px; text-transform: uppercase; padding: 4px 12px; border-radius: 20px; margin-bottom: 10px; }
.vl-bundle__deal-name  { font-family: var(--f-head); font-size: 22px; font-weight: 700; margin-bottom: 5px; }
.vl-bundle__deal-items { font-size: 12.5px; color: var(--c-muted); margin-bottom: 12px; }
.vl-bundle__deal-prices { display: flex; align-items: baseline; gap: 8px; margin-bottom: 16px; }
.vl-bundle__deal-now { font-family: var(--f-head); font-size: 26px; font-weight: 800; color: var(--c-dark); }
.vl-bundle__deal-was { font-size: 14px; color: var(--c-muted); text-decoration: line-through; }
.vl-bundle__deal-btn {
  display: block; text-align: center; background: var(--c-dark); color: #fff;
  font-size: 12.5px; font-weight: 800; letter-spacing: .8px; text-transform: uppercase;
  padding: 12px; border-radius: 8px; text-decoration: none; transition: background .2s;
}
.vl-bundle__deal-btn:hover { background: var(--c-accent); color: var(--c-dark); }

/* ── #16: Sticky Shop Now Bar ──────────────────────────────────── */
.vl-sticky-shop {
  position: fixed; bottom: 72px; left: 0; right: 0; z-index: 290;
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; padding: 10px 20px;
  background: var(--c-dark);
  border-top: 1px solid rgba(201,169,110,.2);
  transform: translateY(100%); transition: transform .35s var(--ease-out);
  box-shadow: 0 -4px 20px rgba(0,0,0,.2);
}
.vl-sticky-shop.visible { transform: translateY(0); }
.vl-sticky-shop__text { font-size: 13.5px; font-weight: 600; color: rgba(255,255,255,.7); }
.vl-sticky-shop__text strong { color: var(--c-accent); }
.vl-sticky-shop__btn {
  background: var(--c-accent); color: var(--c-dark);
  font-size: 12px; font-weight: 900; letter-spacing: .8px; text-transform: uppercase;
  padding: 10px 22px; border-radius: 8px; text-decoration: none;
  white-space: nowrap; transition: background .15s;
  flex-shrink: 0;
}
.vl-sticky-shop__btn:hover { background: var(--c-accent2); }
@media (min-width: 769px) { .vl-sticky-shop { display: none; } }

/* ================================================================
   PREMIUM TRACK ORDER PAGE  (vlt- prefix)
   ================================================================ */
.vlt-wrap {
  min-height: 100vh;
  background: linear-height(135deg, var(--c-dark) 0%, var(--c-dark) 50%, #0f1520 100%);
  background: linear-gradient(135deg, var(--c-dark) 0%, var(--c-dark) 50%, #0f1520 100%);
  position: relative; overflow: hidden;
  padding: 24px 16px 60px;
}

/* Background */
.vlt-bg { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
.vlt-bg__grid {
  position: absolute; inset: 0;
  background-image: linear-gradient(rgba(201,169,110,.04) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(201,169,110,.04) 1px, transparent 1px);
  background-size: 48px 48px;
}
.vlt-bg__glow {
  position: absolute; border-radius: 50%; filter: blur(80px);
  pointer-events: none;
}
.vlt-bg__glow--1 { width: 500px; height: 500px; top: -100px; left: -100px; background: radial-gradient(circle, rgba(201,169,110,.06), transparent 70%); }
.vlt-bg__glow--2 { width: 400px; height: 400px; bottom: 100px; right: -100px; background: radial-gradient(circle, rgba(100,80,200,.05), transparent 70%); }
.vlt-particles { position: absolute; inset: 0; }
.vlt-particles span {
  position: absolute; border-radius: 50%;
  background: var(--c-accent); opacity: .08;
  animation: floatParticle linear infinite;
}
.vlt-particles span:nth-child(1){width:4px;height:4px;left:10%;top:80%;animation-duration:18s;}
.vlt-particles span:nth-child(2){width:3px;height:3px;left:25%;top:60%;animation-duration:22s;animation-delay:2s;}
.vlt-particles span:nth-child(3){width:5px;height:5px;left:40%;top:90%;animation-duration:16s;animation-delay:1s;}
.vlt-particles span:nth-child(4){width:3px;height:3px;left:60%;top:70%;animation-duration:20s;animation-delay:3s;}
.vlt-particles span:nth-child(5){width:4px;height:4px;left:75%;top:85%;animation-duration:25s;animation-delay:.5s;}
.vlt-particles span:nth-child(6){width:3px;height:3px;left:85%;top:40%;animation-duration:19s;animation-delay:4s;}
.vlt-particles span:nth-child(7){width:5px;height:5px;left:15%;top:30%;animation-duration:21s;animation-delay:1.5s;}
.vlt-particles span:nth-child(8){width:3px;height:3px;left:90%;top:60%;animation-duration:17s;animation-delay:2.5s;}

/* Content */
.vlt-content {
  position: relative; z-index: 2;
  max-width: 640px; margin: 0 auto;
}

/* Back + header */
.vlt-back {
  display: inline-flex; align-items: center; gap: 6px;
  color: rgba(255,255,255,.5); font-size: 13px; font-weight: 600;
  text-decoration: none; margin-bottom: 24px;
  transition: color .2s; padding: 8px 0;
}
.vlt-back:hover { color: var(--c-accent); }
.vlt-header { text-align: center; margin-bottom: 28px; color: #fff; }
.vlt-eyebrow {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  font-size: 10px; font-weight: 800; letter-spacing: 4px;
  text-transform: uppercase; color: var(--c-accent); margin-bottom: 12px;
}
.vlt-eyebrow__line { flex: 1; max-width: 32px; height: 1px; background: var(--c-accent); }
.vlt-title { font-family: var(--f-head); font-size: 36px; font-weight: 700; letter-spacing: -.5px; margin-bottom: 10px; }
.vlt-subtitle { font-size: 14.5px; color: rgba(255,255,255,.55); line-height: 1.65; max-width: 400px; margin: 0 auto; }
@media (max-width: 480px) { .vlt-title { font-size: 28px; } }

/* Form card */
.vlt-card {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(201,169,110,.18);
  border-radius: 20px; overflow: hidden;
  backdrop-filter: blur(20px);
  margin-bottom: 20px;
}
.vlt-card__accent {
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--c-accent2), var(--c-accent), var(--c-accent2), transparent);
}
.vlt-form { padding: 28px 28px 20px; }
.vlt-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
@media (max-width: 480px) { .vlt-form__row { grid-template-columns: 1fr; gap: 14px; } }

/* Field */
.vlt-field { display: flex; flex-direction: column; gap: 6px; }
.vlt-field__label {
  display: flex; align-items: center; gap: 6px;
  font-size: 11.5px; font-weight: 700; letter-spacing: .5px;
  text-transform: uppercase; color: rgba(255,255,255,.55);
}
.vlt-field__wrap {
  display: flex; align-items: center;
  background: rgba(255,255,255,.07);
  border: 1.5px solid rgba(255,255,255,.1);
  border-radius: 10px; overflow: hidden;
  transition: border-color .2s, background .2s;
}
.vlt-field__wrap:focus-within {
  border-color: var(--c-accent);
  background: rgba(201,169,110,.06);
  box-shadow: 0 0 0 3px rgba(201,169,110,.1);
}
.vlt-field.error .vlt-field__wrap { border-color: #e53935; }
.vlt-field__prefix { padding: 0 10px; color: rgba(255,255,255,.3); font-family: var(--f-head); font-size: 16px; }
.vlt-input {
  flex: 1; background: none; border: none; outline: none;
  padding: 13px 14px; font-family: var(--f-body); font-size: 14px;
  color: #fff;
}
.vlt-input::placeholder { color: rgba(255,255,255,.25); }
.vlt-field__error { font-size: 11.5px; color: #e53935; min-height: 16px; }

/* Submit button */
.vlt-btn {
  width: 100%; display: flex; align-items: center; justify-content: center; gap: 10px;
  background: linear-gradient(135deg, var(--c-accent2), var(--c-accent));
  color: var(--c-dark); font-family: var(--f-body);
  font-size: 14px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase;
  padding: 15px 28px; border: none; border-radius: 10px; cursor: pointer;
  transition: transform .2s, box-shadow .2s, opacity .2s;
  box-shadow: 0 4px 20px rgba(201,169,110,.3);
  margin-bottom: 18px;
}
.vlt-btn:hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(201,169,110,.4); }
.vlt-btn:disabled { opacity: .7; }
.vlt-btn__spinner svg { animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* Quick links */
.vlt-form__links { display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap; }
.vlt-form__link {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 12px; color: rgba(255,255,255,.4); text-decoration: none;
  transition: color .15s;
}
.vlt-form__link:hover { color: var(--c-accent); }
.vlt-form__link-sep { color: rgba(255,255,255,.2); }

/* Result panel */
.vlt-result { animation: resultIn .5s var(--ease-out); }
@keyframes resultIn { from { opacity:0; transform: translateY(20px); } to { opacity:1; transform: none; } }
.vlt-result__head {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  background: rgba(255,255,255,.06); border: 1px solid rgba(201,169,110,.18);
  border-radius: 14px; padding: 16px 20px; margin-bottom: 16px;
  backdrop-filter: blur(12px);
}
.vlt-result__order-id { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.vlt-result__order-label { font-size: 10px; text-transform: uppercase; letter-spacing: 2px; color: rgba(255,255,255,.4); }
.vlt-result__order-num { font-family: var(--f-head); font-size: 22px; font-weight: 700; color: #fff; }
.vlt-result__status-pill { font-size: 11.5px; font-weight: 800; color: #fff; padding: 5px 14px; border-radius: 20px; letter-spacing: .5px; }
.vlt-result__reset { display: flex; align-items: center; gap: 6px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.1); border-radius: 20px; padding: 6px 12px; font-size: 12px; color: rgba(255,255,255,.5); cursor: pointer; transition: all .2s; font-family: var(--f-body); }
.vlt-result__reset:hover { background: rgba(255,255,255,.14); color: #fff; }

/* Timeline */
.vlt-timeline { margin-bottom: 20px; padding: 0 8px; }
.vlt-timeline__track { height: 3px; background: rgba(255,255,255,.1); border-radius: 2px; margin-bottom: 10px; overflow: hidden; }
.vlt-timeline__fill { height: 100%; background: linear-gradient(90deg, var(--c-accent2), var(--c-accent)); width: 0; transition: width 1s var(--ease-out); border-radius: 2px; box-shadow: 0 0 8px var(--c-accent); }
.vlt-timeline__steps { display: flex; justify-content: space-between; }
.vlt-step { display: flex; flex-direction: column; align-items: center; gap: 6px; flex: 1; }
.vlt-step__dot {
  width: 22px; height: 22px; border-radius: 50%;
  border: 2px solid rgba(255,255,255,.15);
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.06);
  transition: all .3s;
}
.vlt-step__dot svg { opacity: 0; transition: opacity .3s; }
.vlt-step--done .vlt-step__dot { background: var(--c-accent); border-color: var(--c-accent); }
.vlt-step--done .vlt-step__dot svg { opacity: 1; stroke: var(--c-dark); }
.vlt-step--active .vlt-step__dot { border-color: var(--c-accent); box-shadow: 0 0 0 3px rgba(201,169,110,.2); background: rgba(201,169,110,.1); }
.vlt-step__label { font-size: 10px; color: rgba(255,255,255,.4); text-align: center; letter-spacing: .3px; }
.vlt-step--done .vlt-step__label, .vlt-step--active .vlt-step__label { color: var(--c-accent); font-weight: 700; }

/* Status card */
.vlt-status-card {
  display: flex; align-items: flex-start; gap: 16px;
  background: rgba(255,255,255,.06); border: 1px solid rgba(201,169,110,.15);
  border-radius: 16px; padding: 20px; margin-bottom: 16px;
  backdrop-filter: blur(12px);
}
.vlt-status-card__icon { font-size: 32px; flex-shrink: 0; margin-top: 2px; }
.vlt-status-card__body { flex: 1; min-width: 0; }
.vlt-status-card__title { font-family: var(--f-head); font-size: 20px; font-weight: 700; color: #fff; margin-bottom: 5px; }
.vlt-status-card__msg   { font-size: 13.5px; color: rgba(255,255,255,.6); line-height: 1.6; margin-bottom: 6px; }
.vlt-status-card__date  { font-size: 11.5px; color: rgba(255,255,255,.35); }
.vlt-eta {
  display: flex; align-items: center; gap: 10px; flex-shrink: 0;
  background: rgba(201,169,110,.1); border: 1px solid rgba(201,169,110,.2);
  border-radius: 10px; padding: 10px 14px;
}
.vlt-eta svg { stroke: var(--c-accent); flex-shrink: 0; }
.vlt-eta__label { display: block; font-size: 9.5px; text-transform: uppercase; letter-spacing: 1.5px; color: rgba(255,255,255,.4); font-weight: 700; }
.vlt-eta__date  { display: block; font-family: var(--f-head); font-size: 14px; font-weight: 700; color: var(--c-accent); }
@media (max-width: 480px) { .vlt-status-card { flex-direction: column; } .vlt-eta { align-self: flex-start; } }

/* History */
.vlt-history { background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); border-radius: 16px; padding: 20px; margin-bottom: 16px; }
.vlt-history__title { font-size: 12px; font-weight: 800; letter-spacing: 2px; text-transform: uppercase; color: rgba(255,255,255,.4); margin-bottom: 16px; }
.vlt-history__item {
  display: flex; align-items: flex-start; gap: 12px; padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,.06); animation: resultIn .4s var(--ease-out) both;
}
.vlt-history__item:last-child { border-bottom: none; padding-bottom: 0; }
.vlt-history__dot { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,.2); flex-shrink: 0; margin-top: 5px; border: 1.5px solid rgba(255,255,255,.15); }
.vlt-history__dot--active { background: var(--c-accent); border-color: var(--c-accent); box-shadow: 0 0 8px var(--c-accent); }
.vlt-history__info { flex: 1; min-width: 0; }
.vlt-history__event { display: block; font-size: 13.5px; font-weight: 600; color: rgba(255,255,255,.85); margin-bottom: 3px; }
.vlt-history__loc   { display: flex; align-items: center; gap: 4px; font-size: 11.5px; color: rgba(255,255,255,.38); }
.vlt-history__date  { font-size: 11.5px; color: rgba(255,255,255,.35); white-space: nowrap; flex-shrink: 0; }

/* Action buttons */
.vlt-result__actions { display: flex; gap: 10px; margin-bottom: 20px; flex-wrap: wrap; }
.vlt-action-btn {
  display: inline-flex; align-items: center; gap: 7px;
  background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px; padding: 11px 18px; font-size: 13px; font-weight: 600;
  color: rgba(255,255,255,.7); cursor: pointer; text-decoration: none;
  font-family: var(--f-body); transition: all .2s; flex: 1; justify-content: center;
}
.vlt-action-btn:hover { background: rgba(255,255,255,.12); color: #fff; border-color: rgba(255,255,255,.2); }
.vlt-action-btn--primary { background: rgba(201,169,110,.15); border-color: rgba(201,169,110,.3); color: var(--c-accent); }
.vlt-action-btn--primary:hover { background: rgba(201,169,110,.25); }

/* Trust row */
.vlt-trust {
  display: flex; align-items: center; justify-content: center;
  gap: 12px; flex-wrap: wrap; margin-bottom: 24px;
  background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.06);
  border-radius: 12px; padding: 16px;
}
.vlt-trust__item { display: flex; align-items: center; gap: 7px; font-size: 12px; color: rgba(255,255,255,.45); font-weight: 600; }
.vlt-trust__item svg { stroke: var(--c-accent); flex-shrink: 0; }
.vlt-trust__sep { width: 1px; height: 20px; background: rgba(255,255,255,.1); }
@media (max-width: 480px) { .vlt-trust__sep { display: none; } .vlt-trust { justify-content: flex-start; gap: 10px; } }

/* FAQ section on track page */
.vlt-faq { margin-bottom: 24px; }
.vlt-faq__title { font-size: 14px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; color: rgba(255,255,255,.4); margin-bottom: 12px; }
.vlt-faq__item { border-bottom: 1px solid rgba(255,255,255,.07); }
.vlt-faq__q {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; padding: 14px 0; list-style: none; cursor: pointer;
  font-size: 13.5px; font-weight: 600; color: rgba(255,255,255,.7);
  transition: color .2s;
}
.vlt-faq__q:hover { color: #fff; }
.vlt-faq__q svg { flex-shrink: 0; stroke: rgba(255,255,255,.3); transition: transform .25s; }
details[open] .vlt-faq__q svg { transform: rotate(180deg); }
details[open] .vlt-faq__q { color: var(--c-accent); }
.vlt-faq__a { font-size: 13px; color: rgba(255,255,255,.45); line-height: 1.7; padding: 0 0 14px; }

/* Toast */
.vlt-toast {
  position: fixed; bottom: 90px; left: 50%; transform: translateX(-50%) translateY(20px);
  background: var(--c-dark); color: #fff; font-size: 13.5px; font-weight: 600;
  padding: 12px 22px; border-radius: 50px;
  border: 1px solid rgba(201,169,110,.3); z-index: 9999;
  opacity: 0; transition: all .35s var(--ease-out); pointer-events: none;
  white-space: nowrap;
}
.vlt-toast--show { opacity: 1; transform: translateX(-50%) translateY(0); }
.vlt-toast--success { border-color: #22c55e; }
.vlt-toast--info    { border-color: var(--c-accent); }