.vd-header{ position:sticky; top:0; z-index:50; background:var(--white); border-bottom:1px solid var(--line); }
.vd-header__inner{ max-width:var(--wrap); margin:0 auto; padding:18px 40px; display:flex; align-items:center; gap:20px; }
.vd-header__spacer{ flex:1; }

/* Logo */
.vd-logo{ display:flex; align-items:center; gap:10px; }
.vd-logo__mark{ width:32px; height:32px; border-radius:999px; background:var(--green); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.vd-logo__text{ font-family:'Geist',sans-serif; font-weight:600; font-size:22px; letter-spacing:-.03em; color:var(--ink); }
.vd-logo__dot{ color:var(--green); }

/* Nav pills */
.vd-nav{ display:flex; gap:4px; margin-left:8px; }
.vd-nav__link{ padding:8px 14px; border-radius:999px; font-size:14px; font-weight:500; color:var(--ink-2); transition:background .15s,color .15s; }
.vd-nav__link:hover{ color:var(--ink); }
.vd-nav__link.is-active{ color:var(--ink); background:var(--paper); }

/* Search pill */
.vd-search{ display:flex; align-items:center; gap:8px; padding:8px 14px; border:1px solid var(--line); border-radius:999px; background:var(--paper); width:280px; }
.vd-search input{ border:none; outline:none; background:transparent; flex:1; font-size:13.5px; color:var(--ink); min-width:0; }
.vd-search__kbd{ font-size:11px; color:var(--ink-soft); padding:2px 6px; border:1px solid var(--line); border-radius:4px; }

/* Location pill */
.vd-location{ display:flex; align-items:center; gap:6px; padding:8px 14px; border-radius:999px; background:var(--paper); font-size:13px; font-weight:500; white-space:nowrap; }

/* Cart badge */
.vd-cart-badge{ background:rgba(255,255,255,.18); padding:2px 8px; border-radius:999px; font-size:11px; margin-left:4px; }

/* Hamburger (mobile) */
.vd-hamburger{ display:none; flex-direction:column; gap:4px; width:40px; height:40px; border:1px solid var(--line-2); border-radius:999px; background:var(--white); align-items:center; justify-content:center; }
.vd-hamburger span{ width:16px; height:1.6px; background:var(--ink); border-radius:2px; }

/* Mobile drawer */
.vd-drawer{ position:fixed; inset:0; z-index:100; visibility:hidden; }
.vd-drawer.is-open{ visibility:visible; }
.vd-drawer__overlay{ position:absolute; inset:0; background:rgba(15,26,20,.4); opacity:0; transition:opacity .2s; }
.vd-drawer.is-open .vd-drawer__overlay{ opacity:1; }
.vd-drawer__panel{ position:absolute; top:0; right:0; height:100%; width:min(360px,86vw); background:var(--white); padding:24px; transform:translateX(100%); transition:transform .25s ease; display:flex; flex-direction:column; }
.vd-drawer.is-open .vd-drawer__panel{ transform:translateX(0); }
.vd-drawer__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:24px; }
.vd-drawer__close{ width:36px; height:36px; border-radius:999px; border:1px solid var(--line-2); background:var(--white); display:flex; align-items:center; justify-content:center; }
.vd-drawer__links{ display:flex; flex-direction:column; gap:4px; }
.vd-drawer__link{ padding:14px 12px; border-radius:12px; font-size:18px; font-weight:500; }
.vd-drawer__link:hover{ background:var(--paper); }
.vd-drawer__actions{ margin-top:auto; }

@media (max-width:1100px){
  .vd-search{ width:200px; }
  .vd-nav{ display:none; }
}
@media (max-width:1024px){
  .vd-header__inner{ padding:16px 24px; gap:14px; }
  .vd-location, .vd-signin{ display:none; }
}
@media (max-width:640px){
  .vd-header__inner{ padding:14px 16px; }
  .vd-search{ display:none; }
  .vd-cart-btn .vd-cart-badge{ display:none; }
  .vd-hamburger{ display:flex; }
}

.demo-banner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px 32px;
  background: linear-gradient(90deg, #a8341e 0%, #c94a2e 100%);
  color: #FBF1DA;
  font: 500 13px / 1.4 'DM Sans', sans-serif;
  letter-spacing: .02em;
  text-align: center;
}

.demo-banner svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  color: var(--yellow-soft);  
}