/* ─── Buttons ─────────────────────────────────────────────── */
.vd-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 20px; border:none; border-radius:999px;
  background:var(--ink); color:var(--white);
  font-family:'Geist',sans-serif; font-weight:500; font-size:14px; letter-spacing:-.01em;
  cursor:pointer; transition:background .15s, transform .1s; white-space:nowrap;
}
.vd-btn:hover{ background:var(--green-dark); }
.vd-btn.green{ background:var(--green); }
.vd-btn.green:hover{ background:var(--green-dark); }
.vd-btn.ghost{ background:transparent; color:var(--ink); border:1px solid var(--line-2); }
.vd-btn.ghost:hover{ background:var(--paper); }
.vd-btn.sm{ padding:8px 14px; font-size:13px; }
.vd-btn svg{ display:block; }

/* ─── Card ────────────────────────────────────────────────── */
.vd-card{
  background:var(--white); border:1px solid var(--line);
  border-radius:20px; padding:20px;
  transition:border-color .15s, transform .15s;
}
.vd-card:hover{ border-color:var(--line-2); }

/* ─── Chip ────────────────────────────────────────────────── */
.vd-chip{
  display:inline-flex; align-items:center; gap:6px;
  padding:5px 11px; border-radius:999px;
  background:var(--mint-2); color:var(--green-dark);
  font-size:12px; font-weight:500; letter-spacing:-.01em; line-height:1.2;
}
.vd-chip.dark{ background:var(--ink); color:var(--white); }
.vd-chip.outline{ background:transparent; border:1px solid var(--line-2); color:var(--ink-2); }

/* ─── Price ───────────────────────────────────────────────── */
.vd-price{ font-family:'Geist',sans-serif; font-weight:500; letter-spacing:-.03em; }
.vd-from{ color:var(--ink-soft); font-size:.8em; font-weight:400; }

/* ─── Photo placeholder ───────────────────────────────────── */
.vd-ph{
  background:var(--mint-2); border:1px dashed var(--line-2);
  display:flex; align-items:center; justify-content:center;
  color:var(--ink-soft); font-size:12px; width:100%; height:100%;
}

/* ─── Section head + kicker ───────────────────────────────── */
.vd-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:28px; }
.vd-head__title{ font-size:44px; margin:0; }
.vd-kicker{
  display:inline-flex; align-items:center; gap:6px; margin-bottom:14px;
  padding:4px 10px; border-radius:999px; background:var(--mint-2); color:var(--green-dark);
  font-size:12px; font-weight:500;
}
.vd-kicker__dot{ width:5px; height:5px; border-radius:999px; background:var(--green); }

/* ─── Product card ────────────────────────────────────────── */
.vd-product-card{ padding:16px; display:flex; flex-direction:column; height:100%; }
.vd-product-card__media{ position:relative; border-radius:14px; overflow:hidden; aspect-ratio:1/1; background:var(--mint-2); }
.vd-product-card__img-link, .vd-product-card__img-link img{ display:block; width:100%; height:100%; object-fit:cover; }
.vd-product-card__tag{ position:absolute; top:12px; left:12px; }
.vd-fab{
  position:absolute; bottom:12px; right:12px;
  width:38px; height:38px; border-radius:999px; border:none;
  background:var(--white); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 10px -2px rgba(15,26,20,.18);
  transition:transform .12s;
}
.vd-fab:hover{ transform:scale(1.08); }
.vd-product-card__body{ padding:14px 4px 4px; display:flex; flex-direction:column; flex:1; }
.vd-product-card__row{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.vd-product-card__name{ font-size:17px; font-weight:600; color:var(--ink); }
.vd-product-card__row .vd-price{ font-size:17px; white-space:nowrap; }
.vd-product-card__desc{ font-size:13px; color:var(--ink-soft); margin-top:6px; line-height:1.5; }
.vd-product-card__chips{ display:flex; gap:6px; margin-top:auto; padding-top:14px; flex-wrap:wrap; }

/* ─── Breadcrumb ──────────────────────────────────────────── */
.vd-breadcrumb{ padding:18px 0; font-size:13px; color:var(--ink-soft); display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.vd-breadcrumb a:hover{ color:var(--ink); }
.vd-bc__sep{ opacity:.4; }
.vd-bc__current{ color:var(--ink); font-weight:500; }