/* ==========================================================================
   Valley Bloom — frontend styles (extra.css)
   Light, airy, modern-minimalist. Pairs with theme.json design tokens.
   Class prefix: vb-
   ========================================================================== */

:root {
  --vb-radius: 14px;
  --vb-radius-lg: 18px;
  --vb-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */
.vb-header__brand .wp-block-site-logo img {
  border-radius: 0;
  display: block;
}
.vb-header__brand .wp-block-site-logo {
  margin: 0;
}
.vb-header__bar {
  width: 100%;
}
.vb-header__utility a,
.vb-header__utility .wc-block-mini-cart__button {
  color: var(--wp--preset--color--ink);
}
.vb-header .wp-block-navigation a {
  transition: color 0.2s var(--vb-ease);
}
.vb-header .wp-block-navigation a:hover {
  color: var(--wp--preset--color--rose);
}

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */
.vb-hero {
  position: relative;
  display: grid;
  align-items: center;
  min-height: clamp(420px, 56vh, 600px);
  overflow: hidden;
}
.vb-hero__media,
.vb-hero__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.vb-hero__image {
  object-fit: cover;
  object-position: center;
}
.vb-hero::after {
  /* gentle wash so text stays readable over photography, never heavy */
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(251, 247, 243, 0.92) 0%, rgba(251, 247, 243, 0.55) 42%, rgba(251, 247, 243, 0) 75%);
}
.vb-hero__inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: var(--wp--style--global--wide-size, 1240px);
  margin-inline: auto;
  padding: clamp(1.5rem, 5vw, 4rem) clamp(1.25rem, 4vw, 2.5rem);
  box-sizing: border-box;
}
.vb-hero__content {
  max-width: 34rem;
}
.vb-hero__eyebrow {
  margin: 0 0 0.75rem;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--wp--preset--color--moss);
}
.vb-hero__title {
  margin: 0 0 1rem;
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 500;
  font-size: clamp(2.4rem, 6vw, 4.25rem);
  line-height: 1.05;
  letter-spacing: -0.01em;
  color: var(--wp--preset--color--ink);
}
.vb-hero__title em {
  font-style: italic;
  color: var(--wp--preset--color--rose);
}
.vb-hero__lede {
  margin: 0 0 1.75rem;
  font-size: 1.1rem;
  line-height: 1.6;
  color: var(--wp--preset--color--ink);
  max-width: 38ch;
}
.vb-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
}
.vb-hero__btn {
  display: inline-block;
  padding: 0.85rem 1.85rem;
  border-radius: 10px;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 0.2s var(--vb-ease), color 0.2s var(--vb-ease);
}
.vb-hero__btn--primary {
  background: var(--wp--preset--color--rose);
  color: var(--wp--preset--color--cream);
}
.vb-hero__btn--primary:hover {
  background: var(--wp--preset--color--ink);
  color: var(--wp--preset--color--cream);
}
.vb-hero__btn--ghost {
  background: transparent;
  color: var(--wp--preset--color--ink);
  box-shadow: inset 0 0 0 1px var(--wp--preset--color--ink);
}
.vb-hero__btn--ghost:hover {
  background: var(--wp--preset--color--ink);
  color: var(--wp--preset--color--cream);
}

/* --------------------------------------------------------------------------
   Product & category cards
   -------------------------------------------------------------------------- */
.vb-card {
  transition: transform 0.25s var(--vb-ease);
  text-align: center;
}
.vb-card .wc-block-components-product-button { align-items: center !important; }
.vb-card .wp-block-button__link { margin-inline: auto; }
.vb-card:hover {
  transform: translateY(-4px);
}
/* "Order today" shoppable row — extra breathing room between image and name. */
.vb-shoprow .vb-card .wp-block-post-title { margin-top: 0.75rem; }

/* ============ Subscriptions — My Account tab ============ */
.vb-subnotice { background: var(--wp--preset--color--sage); color: #fff; border-radius: 10px; padding: 0.75rem 1rem; margin: 0 0 1.2rem; font-weight: 500; }

/* Customer delivery-date change on the order view */
.vb-ddedit { margin-top: 1.6rem; padding: 1.2rem 1.3rem; background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--blush); border-radius: 14px; }
.vb-ddedit__title { font-size: 1.15rem; margin: 0 0 0.4rem; }
.vb-ddedit__lead { color: var(--wp--preset--color--stone); font-size: 0.92rem; margin: 0 0 0.9rem; }
.vb-ddedit__form { display: flex; gap: 0.6rem; flex-wrap: wrap; align-items: center; }
.vb-ddedit__form input[type="date"] { border: 1px solid var(--wp--preset--color--blush); border-radius: 9px; padding: 0.5rem 0.7rem; background: var(--wp--preset--color--cream); font-family: var(--wp--preset--font-family--inter); font-size: 0.9rem; color: var(--wp--preset--color--ink); }
.vb-subs-intro { color: var(--wp--preset--color--ink); margin: 0 0 1.2rem; }
.vb-subs-empty { color: var(--wp--preset--color--ink); }
.vb-subs { display: flex; flex-direction: column; gap: 1.2rem; }
.vb-subcard { border: 1px solid var(--wp--preset--color--blush); border-radius: 14px; padding: 1.3rem 1.4rem; background: var(--wp--preset--color--white); }
.vb-subcard.is-cancelled-card { opacity: 0.65; }
.vb-subcard__head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.vb-subcard__title { margin: 0; font-size: 1.15rem; }
.vb-badge { font-family: var(--wp--preset--font-family--inter); font-size: 0.66rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; padding: 0.25rem 0.6rem; border-radius: 999px; white-space: nowrap; }
.vb-badge.is-active { background: #eef0e9; color: var(--wp--preset--color--moss); }
.vb-badge.is-paused { background: var(--wp--preset--color--blush); color: var(--wp--preset--color--rose); }
.vb-badge.is-failed { background: #f6d9d3; color: #9e3b2f; }
.vb-badge.is-cancelled { background: #ececec; color: var(--wp--preset--color--stone); }
.vb-subcard__meta { list-style: none; margin: 1rem 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.7rem; }
.vb-subcard__meta li { display: flex; flex-direction: column; gap: 0.2rem; }
.vb-subcard__meta span { font-size: 0.68rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--stone); }
.vb-subcard__meta strong { font-family: var(--wp--preset--font-family--inter); color: var(--wp--preset--color--ink); font-size: 0.95rem; font-weight: 600; }
.vb-subcard__addr { font-size: 0.78rem; color: var(--wp--preset--color--stone); font-weight: 400; text-transform: none; letter-spacing: 0; }
.vb-subctl { display: flex; gap: 0.75rem; align-items: flex-end; flex-wrap: wrap; padding-top: 0.9rem; border-top: 1px solid var(--wp--preset--color--blush); }
.vb-subctl label { display: flex; flex-direction: column; font-size: 0.78rem; color: var(--wp--preset--color--ink); gap: 0.25rem; }
.vb-subctl select, .vb-subctl input, .vb-subedit__grid input { border: 1px solid var(--wp--preset--color--blush); border-radius: 9px; padding: 0.55rem 0.7rem; background: var(--wp--preset--color--cream); font-family: var(--wp--preset--font-family--inter); font-size: 0.9rem; color: var(--wp--preset--color--ink); }
.vb-subactions { display: flex; gap: 0.6rem; flex-wrap: wrap; margin-top: 0.8rem; }
.vb-btn { border: 0; border-radius: 9px; padding: 0.55rem 1rem; font-family: var(--wp--preset--font-family--inter); font-weight: 600; font-size: 0.85rem; cursor: pointer; text-decoration: none; line-height: 1; }
.vb-btn--rose { background: var(--wp--preset--color--rose); color: var(--wp--preset--color--cream); }
.vb-btn--rose:hover { background: var(--wp--preset--color--ink); }
.vb-btn--ghost { background: transparent; color: var(--wp--preset--color--ink); box-shadow: inset 0 0 0 1px var(--wp--preset--color--blush); }
.vb-btn--ghost:hover { background: var(--wp--preset--color--cream); }
.vb-btn--cancel { background: transparent; color: var(--wp--preset--color--rose); box-shadow: inset 0 0 0 1px var(--wp--preset--color--blush); }
.vb-btn--cancel:hover { background: #f6d9d3; }
.vb-subedit { margin-top: 1rem; padding-top: 0.9rem; border-top: 1px solid var(--wp--preset--color--blush); }
.vb-subedit summary {
  cursor: pointer;
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--wp--preset--font-family--inter);
  font-weight: 600;
  font-size: 0.85rem;
  color: var(--wp--preset--color--moss);
  transition: color 0.2s var(--vb-ease);
}
.vb-subedit summary::-webkit-details-marker { display: none; }
.vb-subedit summary::after {
  content: "\203A"; /* › chevron */
  font-size: 1.05rem;
  line-height: 1;
  transition: transform 0.2s var(--vb-ease);
}
.vb-subedit[open] summary::after { transform: rotate(90deg); }
.vb-subedit summary:hover { color: var(--wp--preset--color--rose); }
.vb-subedit__grid { display: flex; flex-wrap: wrap; gap: 0.7rem; margin-top: 0.8rem; align-items: flex-end; }
.vb-subedit__grid label { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.76rem; color: var(--wp--preset--color--ink); }
.vb-subedit__grid label.full { flex: 1 1 100%; }
.vb-subedit__grid label.half { flex: 1 1 calc(50% - 0.35rem); }
.vb-subedit__grid label.quarter { flex: 1 1 calc(25% - 0.55rem); }
.vb-subedit__grid input { width: 100%; box-sizing: border-box; }
@media (max-width: 600px) {
  .vb-subcard__meta { grid-template-columns: 1fr; }
  .vb-subedit__grid label.half, .vb-subedit__grid label.quarter { flex: 1 1 100%; }
  .vb-subctl, .vb-subctl label { width: 100%; }
}

/* Reorder block on the order-view page. */
.vb-reorder { margin: 1.6rem 0 0; padding-top: 1.4rem; border-top: 1px solid var(--wp--preset--color--blush); }
.vb-reorder__title { font-family: var(--wp--preset--font-family--fraunces); font-size: 1.25rem; font-weight: 500; margin: 0 0 0.9rem; }
.vb-reorder__row { display: flex; flex-wrap: wrap; align-items: center; gap: 0.8rem; }
.vb-reorder__sub { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.vb-reorder__sub select { border: 1px solid var(--wp--preset--color--blush); border-radius: 9px; padding: 0.5rem 0.7rem; background: var(--wp--preset--color--cream); font-family: var(--wp--preset--font-family--inter); font-size: 0.85rem; color: var(--wp--preset--color--ink); }
.vb-reorder__note { margin: 0.7rem 0 0; font-family: var(--wp--preset--font-family--inter); font-size: 0.78rem; color: var(--wp--preset--color--stone); }
/* The reorder button is an <a>; the WooCommerce account link rule is more
   specific, so force the button text colour. */
.vb-reorder a.vb-btn--rose,
.vb-reorder a.vb-btn--rose:hover { color: var(--wp--preset--color--cream) !important; }
@media (max-width: 600px) {
  .vb-reorder__row, .vb-reorder__sub { width: 100%; }
  .vb-reorder__row .vb-btn, .vb-reorder__sub, .vb-reorder__sub select, .vb-reorder__sub .vb-btn { width: 100%; text-align: center; }
}

/* ============ Subscribe & save — product delivery-frequency cards ============ */
.vb-sub { margin: 1.1rem 0; padding: 1rem 1.1rem; border: 1px solid var(--wp--preset--color--blush); border-radius: 14px; background: var(--wp--preset--color--cream); }
.vb-sub__label { display: block; font-family: var(--wp--preset--font-family--inter); font-size: 0.72rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--rose); margin-bottom: 0.7rem; }
.vb-sub__label em { color: var(--wp--preset--color--moss); font-style: normal; }
.vb-sub__card { display: flex; align-items: center; gap: 0.75rem; padding: 0.7rem 0.85rem; margin-bottom: 0.5rem; border: 1.5px solid var(--wp--preset--color--blush); border-radius: 11px; background: var(--wp--preset--color--white); cursor: pointer; transition: border-color 0.15s ease, box-shadow 0.15s ease; }
.vb-sub__card:last-of-type { margin-bottom: 0; }
.vb-sub__card input { accent-color: var(--wp--preset--color--rose); width: 1.05rem; height: 1.05rem; flex: 0 0 auto; margin: 0; }
.vb-sub__card.is-selected { border-color: var(--wp--preset--color--rose); box-shadow: inset 0 0 0 1px var(--wp--preset--color--rose); background: var(--wp--preset--color--cream); }
.vb-sub__card-main { display: flex; flex-direction: column; gap: 0.1rem; flex: 1 1 auto; }
.vb-sub__card-title { font-family: var(--wp--preset--font-family--inter); font-weight: 600; font-size: 0.95rem; color: var(--wp--preset--color--ink); }
.vb-sub__card-sub { font-family: var(--wp--preset--font-family--inter); font-size: 0.78rem; color: var(--wp--preset--color--stone); line-height: 1.4; }
.vb-sub__card-tag { display: flex; flex-direction: column; align-items: flex-end; gap: 0.1rem; flex: 0 0 auto; text-align: right; }
.vb-sub__save { font-family: var(--wp--preset--font-family--inter); font-size: 0.7rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--wp--preset--color--moss); background: #eef0e9; padding: 0.15rem 0.5rem; border-radius: 999px; }
.vb-sub__price { font-family: var(--wp--preset--font-family--inter); font-size: 0.82rem; color: var(--wp--preset--color--ink); }
.vb-sub__note { margin: 0.7rem 0 0; font-family: var(--wp--preset--font-family--inter); font-size: 0.82rem; line-height: 1.5; color: var(--wp--preset--color--stone); }

/* ============ Gift add-on bumps — "Add a finishing touch" ============ */
.vb-bumps { margin: 1.1rem 0; padding: 0.9rem 1rem; border: 1px solid var(--wp--preset--color--blush); border-radius: 14px; background: var(--wp--preset--color--white); transition: opacity 0.15s ease; }
.vb-bumps.is-disabled { opacity: 0.5; }
.vb-bumps__label { display: block; font-family: var(--wp--preset--font-family--inter); font-size: 0.72rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wp--preset--color--rose); margin-bottom: 0.6rem; }
.vb-bump { display: flex; align-items: center; gap: 0.7rem; padding: 0.45rem 0.4rem; border-radius: 9px; cursor: pointer; }
.vb-bump:hover { background: var(--wp--preset--color--cream); }
.vb-bump input { accent-color: var(--wp--preset--color--rose); width: 1.05rem; height: 1.05rem; flex: 0 0 auto; margin: 0; }
.vb-bump__img { flex: 0 0 auto; }
.vb-bump__img img { width: 40px; height: 40px; object-fit: cover; border-radius: 7px; display: block; }
.vb-bump__main { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; flex: 1 1 auto; }
.vb-bump__name { font-family: var(--wp--preset--font-family--inter); font-size: 0.9rem; color: var(--wp--preset--color--ink); }
.vb-bump__price { font-family: var(--wp--preset--font-family--inter); font-size: 0.85rem; font-weight: 600; color: var(--wp--preset--color--moss); white-space: nowrap; }
.vb-bumps__note { margin: 0.5rem 0 0; font-family: var(--wp--preset--font-family--inter); font-size: 0.78rem; color: var(--wp--preset--color--stone); display: none; }
.vb-bumps.is-disabled .vb-bumps__note { display: block; }

/* ============ Sticky mobile add-to-cart bar ============ */
.vb-sticky-atc { display: none; }
@media (max-width: 781px) {
  .vb-sticky-atc {
    display: flex; align-items: center; gap: 0.8rem;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990;
    padding: 0.6rem 1rem calc(0.6rem + env(safe-area-inset-bottom, 0px));
    background: var(--wp--preset--color--white);
    border-top: 1px solid var(--wp--preset--color--blush);
    box-shadow: 0 -6px 20px rgba(43, 39, 36, 0.08);
    transform: translateY(110%); transition: transform 0.25s ease;
  }
  .vb-sticky-atc.is-visible { transform: translateY(0); }
  .vb-sticky-atc__info { display: flex; flex-direction: column; gap: 0.1rem; flex: 1 1 auto; min-width: 0; }
  .vb-sticky-atc__name { font-family: var(--wp--preset--font-family--inter); font-weight: 600; font-size: 0.85rem; color: var(--wp--preset--color--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .vb-sticky-atc__price { font-family: var(--wp--preset--font-family--inter); font-size: 0.85rem; color: var(--wp--preset--color--moss); }
  .vb-sticky-atc__price del { color: var(--wp--preset--color--stone); opacity: 0.7; margin-right: 0.3rem; }
  .vb-sticky-atc__btn {
    flex: 0 0 auto; border: 0; border-radius: 10px; cursor: pointer;
    padding: 0.8rem 1.4rem; font-family: var(--wp--preset--font-family--inter); font-weight: 600; font-size: 0.95rem;
    background: var(--wp--preset--color--rose); color: var(--wp--preset--color--cream);
  }
  .vb-sticky-atc__btn[disabled] { opacity: 0.5; cursor: default; }
}

/* ============ Slide-out cart drawer ============ */
body.vb-drawer-open { overflow: hidden; }
.vb-drawer__overlay {
  position: fixed; inset: 0; z-index: 99990;
  background: rgba(43, 39, 36, 0.38);
  opacity: 0; visibility: hidden; transition: opacity 0.25s ease, visibility 0.25s ease;
}
.vb-drawer__overlay.is-open { opacity: 1; visibility: visible; }
.vb-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 99991;
  width: 400px; max-width: 92vw;
  display: flex; flex-direction: column;
  background: var(--wp--preset--color--cream);
  box-shadow: -10px 0 40px rgba(43, 39, 36, 0.16);
  transform: translateX(100%); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  font-family: var(--wp--preset--font-family--inter);
}
.vb-drawer.is-open { transform: translateX(0); }
.vb-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 1.1rem 1.3rem; border-bottom: 1px solid var(--wp--preset--color--blush); }
.vb-drawer__title { font-family: var(--wp--preset--font-family--fraunces); font-size: 1.3rem; font-weight: 500; margin: 0; color: var(--wp--preset--color--ink); }
.vb-drawer__close { background: none; border: 0; font-size: 1.8rem; line-height: 1; cursor: pointer; color: var(--wp--preset--color--stone); padding: 0 0.2rem; }
.vb-drawer__close:hover { color: var(--wp--preset--color--ink); }
.vb-drawer__body { flex: 1 1 auto; overflow-y: auto; padding: 1.1rem 1.3rem; }
.vb-drawer__empty { text-align: center; color: var(--wp--preset--color--stone); margin: 3rem 0; line-height: 1.7; }
.vb-drawer__empty a { color: var(--wp--preset--color--rose); }

.vb-drawer__prog { margin-bottom: 1.2rem; }
.vb-drawer__prog p { margin: 0 0 0.4rem; font-size: 0.82rem; color: var(--wp--preset--color--moss); }
.vb-drawer__track { height: 6px; border-radius: 999px; background: var(--wp--preset--color--blush); overflow: hidden; }
.vb-drawer__track span { display: block; height: 100%; background: var(--wp--preset--color--sage); border-radius: 999px; transition: width 0.4s ease; }

.vb-drawer__item { display: flex; gap: 0.8rem; padding: 0.9rem 0; border-bottom: 1px solid var(--wp--preset--color--blush); position: relative; }
.vb-drawer__item.is-busy { opacity: 0.5; pointer-events: none; }
.vb-drawer__thumb { width: 64px; height: 64px; object-fit: cover; border-radius: 9px; flex: 0 0 auto; }
.vb-drawer__info { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 0.25rem; }
.vb-drawer__name { font-weight: 600; font-size: 0.9rem; color: var(--wp--preset--color--ink); }
.vb-drawer__meta { font-size: 0.76rem; color: var(--wp--preset--color--stone); }
.vb-drawer__qty { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.3rem; }
.vb-drawer__qty button { width: 24px; height: 24px; border: 1px solid var(--wp--preset--color--blush); background: var(--wp--preset--color--white); border-radius: 6px; cursor: pointer; font-size: 1rem; line-height: 1; color: var(--wp--preset--color--ink); }
.vb-drawer__count { min-width: 1.2rem; text-align: center; font-size: 0.85rem; }
.vb-drawer__remove { border: 0 !important; background: none !important; width: auto !important; color: var(--wp--preset--color--stone); font-size: 0.74rem; text-decoration: underline; cursor: pointer; margin-left: 0.3rem; }
.vb-drawer__remove:hover { color: var(--wp--preset--color--rose); }
.vb-drawer__price { font-weight: 600; font-size: 0.88rem; color: var(--wp--preset--color--ink); flex: 0 0 auto; }

.vb-drawer__upsell { margin-top: 1.1rem; padding: 0.9rem 1rem; border: 1px dashed var(--wp--preset--color--blush); border-radius: 12px; background: var(--wp--preset--color--white); }
.vb-drawer__upsell-label { display: block; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--rose); margin-bottom: 0.6rem; }
.vb-drawer__upsell-row { display: flex; align-items: center; gap: 0.6rem; }
.vb-drawer__upsell-row img { width: 38px; height: 38px; object-fit: cover; border-radius: 7px; flex: 0 0 auto; }
.vb-drawer__upsell-name { flex: 1 1 auto; font-size: 0.85rem; color: var(--wp--preset--color--ink); }
.vb-drawer__upsell-price { font-size: 0.82rem; color: var(--wp--preset--color--moss); font-weight: 600; }
.vb-drawer__upsell-add { flex: 0 0 auto; border: 0; border-radius: 8px; padding: 0.4rem 0.85rem; background: var(--wp--preset--color--sage); color: #fff; font-weight: 600; font-size: 0.8rem; cursor: pointer; }
.vb-drawer__upsell-add[disabled] { opacity: 0.6; cursor: default; }

.vb-drawer__foot { flex: 0 0 auto; padding: 1.1rem 1.3rem calc(1.1rem + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--wp--preset--color--blush); background: var(--wp--preset--color--cream); }
.vb-drawer__foot:empty { display: none; }
.vb-drawer__subtotal { display: flex; justify-content: space-between; align-items: baseline; font-size: 1rem; }
.vb-drawer__subtotal strong { font-size: 1.15rem; color: var(--wp--preset--color--ink); }
.vb-drawer__fineprint { margin: 0.2rem 0 0.8rem; font-size: 0.74rem; color: var(--wp--preset--color--stone); }
.vb-drawer__checkout { display: block; text-align: center; background: var(--wp--preset--color--rose); color: var(--wp--preset--color--cream); font-weight: 600; padding: 0.85rem; border-radius: 10px; text-decoration: none; }
.vb-drawer__checkout:hover { background: var(--wp--preset--color--ink); }
.vb-drawer__view { display: block; text-align: center; margin-top: 0.5rem; color: var(--wp--preset--color--ink); font-size: 0.85rem; text-decoration: underline; }

/* ============ Homepage category tiles — uniform crop for portrait photos ============ */
.vb-cat .wp-block-image img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  display: block;
}

/* ============ Testimonials — "Loved by our community" ============ */
.vb-testi {
  background: var(--wp--preset--color--white);
  border-top: 1px solid var(--wp--preset--color--blush);
  border-bottom: 1px solid var(--wp--preset--color--blush);
  padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--40);
}
.vb-testi__inner { max-width: var(--wp--style--global--wide-size, 1100px); margin: 0 auto; text-align: center; }
.vb-testi__eyebrow {
  margin: 0 0 0.3rem;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--wp--preset--color--rose);
}
.vb-testi__title {
  margin: 0 0 2rem;
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 500;
  font-size: clamp(1.7rem, 3vw, 2.2rem);
  color: var(--wp--preset--color--ink);
}
.vb-testi__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.4rem;
  text-align: left;
}
.vb-testi__card {
  margin: 0;
  padding: 1.6rem 1.5rem 1.4rem;
  background: var(--wp--preset--color--cream);
  border: 1px solid var(--wp--preset--color--blush);
  border-radius: var(--vb-radius);
}
.vb-testi__stars { display: flex; gap: 0.15rem; color: var(--wp--preset--color--rose); margin-bottom: 0.7rem; }
.vb-testi__quote {
  margin: 0 0 0.9rem;
  font-family: var(--wp--preset--font-family--fraunces);
  font-style: italic;
  font-size: 1.02rem;
  line-height: 1.55;
  color: var(--wp--preset--color--ink);
}
.vb-testi__name {
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--wp--preset--color--moss);
}
.vb-testi__more { margin: 2rem 0 0; }
.vb-testi__more a {
  font-family: var(--wp--preset--font-family--inter);
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--wp--preset--color--moss);
  text-decoration: none;
}
.vb-testi__more a:hover { color: var(--wp--preset--color--rose); }
@media (max-width: 900px) { .vb-testi__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .vb-testi__grid { grid-template-columns: 1fr; } }

/* ============ Journal (blog) — editorial layout ============ */
.vb-eyebrow {
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--wp--preset--color--rose);
  margin: 0 0 0.25rem;
}
.vb-jintro h1 { font-size: clamp(2rem, 4vw, 2.9rem); }

/* Category eyebrow (post terms) on featured + cards */
.vb-jfeatured .wp-block-post-terms,
.vb-jcard .wp-block-post-terms {
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--wp--preset--color--rose);
  margin: 0 0 0.35rem;
}
.vb-jfeatured .wp-block-post-terms a,
.vb-jcard .wp-block-post-terms a { color: inherit; text-decoration: none; }

/* Featured (latest) post */
.vb-jfeatured .wp-block-post-featured-image { overflow: hidden; border-radius: 16px; margin: 0; }
.vb-jfeatured .wp-block-post-featured-image img { width: 100%; transition: transform 0.6s var(--vb-ease); }
.vb-jfeatured:hover .wp-block-post-featured-image img { transform: scale(1.03); }
.vb-jfeatured .wp-block-post-title {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 500;
  font-size: clamp(1.6rem, 2.6vw, 2.15rem);
  line-height: 1.14;
  margin: 0 0 0.3rem;
}
.vb-jfeatured .wp-block-post-title a { text-decoration: none; color: var(--wp--preset--color--ink); }
.vb-jfeatured .wp-block-post-excerpt { margin-top: 0.7rem; color: var(--wp--preset--color--ink); }

/* Card grid */
.vb-jgrid .wp-block-post-template.is-layout-grid { gap: var(--wp--preset--spacing--50); }
.vb-jcard .wp-block-post-featured-image { overflow: hidden; border-radius: 14px; margin: 0 0 0.85rem; display: block; }
.vb-jcard .wp-block-post-featured-image img { width: 100%; transition: transform 0.5s var(--vb-ease); }
.vb-jcard:hover .wp-block-post-featured-image img { transform: scale(1.03); }
.vb-jcard .wp-block-post-title {
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 500;
  font-size: 1.22rem;
  line-height: 1.25;
  margin: 0 0 0.15rem;
}
.vb-jcard .wp-block-post-title a { text-decoration: none; color: var(--wp--preset--color--ink); }
.vb-jcard .wp-block-post-excerpt { font-size: 0.92rem; line-height: 1.55; margin-top: 0.4rem; color: var(--wp--preset--color--ink); }

/* "Read more / Read the story" link */
.wp-block-post-excerpt__more-link {
  display: inline-block;
  margin-top: 0.6rem;
  font-family: var(--wp--preset--font-family--inter);
  font-weight: 600;
  font-size: 0.82rem;
  letter-spacing: 0.03em;
  color: var(--wp--preset--color--rose);
  text-decoration: none;
}
.wp-block-post-excerpt__more-link:hover { color: var(--wp--preset--color--ink); }

/* Single post byline + CTA */
.vb-byline { font-family: var(--wp--preset--font-family--inter); font-size: 0.8rem; letter-spacing: 0.04em; margin: 0.4rem 0 0; }
.vb-jcta { text-align: center; }

/* Responsive: 3 → 2 → 1 columns; stack the featured block */
@media (max-width: 900px) {
  .vb-jgrid .wp-block-post-template.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 600px) {
  .vb-jgrid .wp-block-post-template.is-layout-grid { grid-template-columns: 1fr !important; }
  .vb-jfeatured .wp-block-columns { gap: 1.2rem; }
}

/* "You might also love" — center the picks row (and keep cards from over-stretching). */
.vb-related .wc-block-product-template {
  justify-content: center;
}
.vb-related .wc-block-product-template.is-flex-container > li {
  max-width: 320px;
}
/* Mobile: 2-up (3rd centers below) instead of cramped 3-across. */
@media (max-width: 600px) {
  .vb-related .wc-block-product-template.is-flex-container {
    flex-wrap: wrap;
    justify-content: center;
  }
  .vb-related .wc-block-product-template.is-flex-container > li {
    max-width: none;
    flex: 0 1 calc(50% - 0.6rem);
  }
}
.vb-card img {
  border-radius: var(--vb-radius);
  width: 100%;
  height: auto;
}
.vb-card .wp-block-post-title a {
  color: var(--wp--preset--color--ink);
  text-decoration: none;
}
.vb-card .wp-block-post-title a:hover {
  color: var(--wp--preset--color--rose);
}

.vb-cat {
  text-align: center;
}
.vb-cat img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  height: auto;
  display: block;
  transition: transform 0.4s var(--vb-ease);
}
.vb-cat .wp-block-image {
  margin: 0;
  overflow: hidden;
  border-radius: 14px;
}
.vb-cat:hover img {
  transform: scale(1.03);
}
.vb-cat__title {
  margin-top: 0.85rem;
}
.vb-cat__title a {
  color: var(--wp--preset--color--ink);
  text-decoration: none;
}
.vb-cat__title a:hover {
  color: var(--wp--preset--color--rose);
}

/* --------------------------------------------------------------------------
   Outline button style (block style variant fallback)
   -------------------------------------------------------------------------- */
.wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent;
  color: var(--wp--preset--color--ink);
  box-shadow: inset 0 0 0 1px var(--wp--preset--color--ink);
  border: 0;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--wp--preset--color--ink);
  color: var(--wp--preset--color--cream);
}

/* --------------------------------------------------------------------------
   Newsletter
   -------------------------------------------------------------------------- */
.vb-newsletter {
  display: flex;
  gap: 0.5rem;
  max-width: 460px;
  margin: 0.5rem auto 0;
}
.vb-newsletter__email {
  flex: 1;
  padding: 0.8rem 1rem;
  border: 0;
  border-radius: 10px;
  font-size: 1rem;
  background: var(--wp--preset--color--cream);
  color: var(--wp--preset--color--ink);
}
.vb-newsletter__btn {
  padding: 0.8rem 1.5rem;
  border: 0;
  border-radius: 10px;
  font-family: var(--wp--preset--font-family--inter);
  font-weight: 600;
  cursor: pointer;
  background: var(--wp--preset--color--ink);
  color: var(--wp--preset--color--cream);
  transition: background-color 0.2s var(--vb-ease);
}
.vb-newsletter__btn:hover {
  background: var(--wp--preset--color--rose);
}

/* --------------------------------------------------------------------------
   WooCommerce light-touch tweaks
   -------------------------------------------------------------------------- */
.woocommerce ul.products li.product,
.wc-block-grid__product {
  text-align: left;
}
.wc-block-components-product-image img,
.woocommerce ul.products li.product img {
  border-radius: var(--vb-radius);
}
.woocommerce span.onsale,
.wc-block-components-product-sale-badge {
  background: var(--wp--preset--color--rose);
  color: var(--wp--preset--color--cream);
  border-radius: 999px;
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 781px) {
  /* Tighten the global section rhythm on phones — desktop is untouched.
     These presets drive section padding + large block gaps site-wide. */
  :root {
    --wp--preset--spacing--50: 1.1rem !important;
    --wp--preset--spacing--60: 1.6rem !important;
    --wp--preset--spacing--70: 2.25rem !important;
    --wp--preset--spacing--80: 2.75rem !important;
  }

  .vb-hero {
    min-height: 78vh;
    align-items: start;
  }
  .vb-hero__inner {
    max-width: 100%;
    text-align: center;
    padding-top: 2.25rem;
  }
  .vb-hero__content {
    max-width: 100%;
  }
  /* Opaque behind the headline at the top, then clears so the arrangement shows below. */
  .vb-hero::after {
    background: linear-gradient(180deg, rgba(251, 247, 243, 0.95) 0%, rgba(251, 247, 243, 0.82) 28%, rgba(251, 247, 243, 0.25) 48%, rgba(251, 247, 243, 0) 66%);
  }
  .vb-hero__lede {
    margin-inline: auto;
  }
  .vb-hero__actions {
    justify-content: center;
  }
  .vb-newsletter {
    flex-direction: column;
  }

  /* Comfortable headline sizing on small screens. */
  .vb-hero__title {
    font-size: clamp(2.3rem, 11vw, 3rem);
  }

  /* Tap targets: full-width primary actions read better on phones. */
  .vb-hero__actions {
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .vb-hero__btn {
    width: 100%;
    max-width: 320px;
    text-align: center;
  }
}

/* Keep WooCommerce product grids tidy on phones (2-up, not 3–4 cramped columns). */
@media (max-width: 600px) {
  .wp-block-woocommerce-product-template,
  .wc-block-product-template {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1rem !important;
  }
  .wc-block-product-collection .wc-block-product-template__responsive,
  ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* --------------------------------------------------------------------------
   Announcement popup (e.g. MooFest) — on-brand modal
   -------------------------------------------------------------------------- */
.vb-pop__backdrop {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
  background: rgba(43, 39, 36, 0.45);
  opacity: 0;
  transition: opacity 0.3s var(--vb-ease);
}
.vb-pop__backdrop.is-open { opacity: 1; }
.vb-pop {
  position: relative;
  max-width: 430px;
  width: 100%;
  background: var(--wp--preset--color--cream);
  border-radius: 18px;
  border-top: 4px solid var(--wp--preset--color--blush);
  padding: 2.6rem 2rem 1.6rem;
  text-align: center;
  box-shadow: 0 24px 60px rgba(43, 39, 36, 0.28);
  transform: translateY(12px) scale(0.98);
  transition: transform 0.3s var(--vb-ease);
}
.vb-pop__backdrop.is-open .vb-pop { transform: none; }
.vb-pop__close {
  position: absolute;
  top: 0.5rem;
  right: 0.85rem;
  border: 0;
  background: none;
  font-size: 1.7rem;
  line-height: 1;
  color: var(--wp--preset--color--stone);
  cursor: pointer;
}
.vb-pop__close:hover { color: var(--wp--preset--color--ink); }
.vb-pop__mark {
  width: 66px;
  height: 66px;
  object-fit: contain;
  display: block;
  margin: 0 auto 0.5rem;
}
.vb-pop__eyebrow {
  margin: 0 0 0.35rem;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--wp--preset--color--rose);
}
.vb-pop__title {
  margin: 0 0 0.6rem;
  font-family: var(--wp--preset--font-family--fraunces);
  font-weight: 500;
  font-size: 1.7rem;
  line-height: 1.12;
  color: var(--wp--preset--color--ink);
}
.vb-pop__body {
  margin: 0 0 1.4rem;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--wp--preset--color--ink);
}
.vb-pop__actions { display: flex; justify-content: center; }
.vb-pop__btn {
  border: 0;
  border-radius: 10px;
  padding: 0.8rem 1.8rem;
  font-family: var(--wp--preset--font-family--inter);
  font-weight: 600;
  font-size: 0.95rem;
  cursor: pointer;
  background: var(--wp--preset--color--rose);
  color: var(--wp--preset--color--cream);
  transition: background-color 0.2s var(--vb-ease);
}
.vb-pop__btn:hover { background: var(--wp--preset--color--ink); }
.vb-pop__link {
  display: inline-block;
  margin-top: 0.9rem;
  font-size: 0.85rem;
  color: var(--wp--preset--color--moss);
  text-decoration: none;
}
.vb-pop__link:hover { text-decoration: underline; }
@media (max-width: 480px) {
  .vb-pop { padding: 2.2rem 1.4rem 1.3rem; }
  .vb-pop__title { font-size: 1.5rem; }
}

/* Exit-intent lead form (inside .vb-pop) */
.vb-pop--exit .vb-pop__body { margin-bottom: 1rem; }
.vb-exitform { display: flex; flex-direction: column; gap: 0.6rem; text-align: left; }
.vb-exitform__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.vb-exitform__email,
.vb-exitform__phone,
.vb-exitform__msg {
  width: 100%;
  padding: 0.7rem 0.9rem;
  border: 0;
  border-radius: 12px;
  box-shadow: inset 0 0 0 1px var(--wp--preset--color--blush);
  background: var(--wp--preset--color--cream);
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.95rem;
  color: var(--wp--preset--color--ink);
  box-sizing: border-box;
}
.vb-exitform__msg { resize: vertical; min-height: 3.2rem; }
.vb-exitform__email:focus,
.vb-exitform__phone:focus,
.vb-exitform__msg:focus { outline: none; box-shadow: inset 0 0 0 1.5px var(--wp--preset--color--rose); }
.vb-exitform__btn { width: 100%; margin-top: 0.2rem; }
.vb-exitform__btn:disabled { opacity: 0.6; cursor: default; }
.vb-exitform__status { margin: 0.1rem 0 0; font-family: var(--wp--preset--font-family--inter); font-size: 0.82rem; color: var(--wp--preset--color--moss); }
.vb-exitform__status.is-error { color: var(--wp--preset--color--rose); }
.vb-exitform__success {
  margin: 0.6rem 0;
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: 1.15rem;
  color: var(--wp--preset--color--moss);
  text-align: center;
}

/* Welcome / first-order-offer popup (newsletter capture + coupon reveal) */
.vb-pop--news .vb-pop__body { margin-bottom: 1.1rem; }
.vb-popnews { display: flex; flex-direction: column; gap: 0.6rem; }
.vb-popnews .vb-pop__btn { width: 100%; margin-top: 0.1rem; }
.vb-popnews .vb-pop__btn:disabled { opacity: 0.6; cursor: default; }
.vb-popnews__msg {
  margin: 0.1rem 0 0;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.82rem;
  color: var(--wp--preset--color--moss);
}
.vb-popnews__msg.is-error { color: var(--wp--preset--color--rose); }
.vb-coupon { text-align: center; }
.vb-coupon__intro {
  margin: 0 0 0.7rem;
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: 1.15rem;
  color: var(--wp--preset--color--moss);
}
.vb-coupon__code {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0.2rem;
  width: 100%;
  padding: 0.85rem 1rem;
  border: 1.5px dashed var(--wp--preset--color--rose);
  border-radius: 12px;
  background: var(--wp--preset--color--blush);
  cursor: pointer;
  transition: background-color 0.2s var(--vb-ease);
}
.vb-coupon__code:hover { background: var(--wp--preset--color--cream); }
.vb-coupon__val {
  font-family: var(--wp--preset--font-family--inter);
  font-weight: 700;
  font-size: 1.25rem;
  letter-spacing: 0.14em;
  color: var(--wp--preset--color--ink);
}
.vb-coupon__copy {
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--wp--preset--color--rose);
}
.vb-coupon__code.is-copied { background: var(--wp--preset--color--cream); }
.vb-coupon__code.is-copied .vb-coupon__copy { color: var(--wp--preset--color--moss); }
.vb-coupon__hint {
  margin: 0.7rem 0 0;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.85rem;
  color: var(--wp--preset--color--ink);
}

/* --------------------------------------------------------------------------
   Cart & Checkout — branded, responsive (WooCommerce blocks)
   -------------------------------------------------------------------------- */
/* Section/step headings in the display serif */
.wc-block-components-checkout-step__title,
.wc-block-components-title,
.wp-block-woocommerce-cart-order-summary-block .wc-block-components-totals-item__label {
  font-family: var(--wp--preset--font-family--fraunces) !important;
}
.wc-block-components-checkout-step__title { color: var(--wp--preset--color--ink); }

/* Inputs / selects: soft, on-brand */
.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-block-components-select select,
.wc-block-components-combobox input,
.wc-block-checkout select {
  border-radius: 10px !important;
  border-color: var(--wp--preset--color--blush) !important;
}

/* Order-summary sidebar → cream card, sticky on desktop */
.wc-block-checkout__sidebar,
.wp-block-woocommerce-cart-totals-block {
  background: var(--wp--preset--color--cream);
  border: 1px solid var(--wp--preset--color--blush);
  border-radius: var(--vb-radius-lg);
  padding: 1.25rem 1.25rem 0.5rem;
}
@media (min-width: 782px) {
  .wc-block-checkout__sidebar { position: sticky; top: 1.25rem; }
}

/* Primary buttons (Place order / Proceed) → dusty rose */
.wc-block-components-button.contained,
.wc-block-cart__submit-button .wc-block-components-button.contained,
.wc-block-components-checkout-place-order-button {
  background-color: var(--wp--preset--color--rose) !important;
  color: var(--wp--preset--color--cream) !important;
  border-radius: 10px !important;
}
.wc-block-components-button.contained:hover {
  background-color: var(--wp--preset--color--ink) !important;
}

/* Trust line (added in template) */
.vb-trustline {
  text-align: center;
  font-size: 0.82rem;
  letter-spacing: 0.02em;
  color: var(--wp--preset--color--stone);
  margin: 0.75rem 0 0;
}

/* Substitution / gifting notice */
.vb-checkout-note {
  background: var(--wp--preset--color--blush);
  border-radius: 12px;
  padding: 0.85rem 1.1rem;
  font-size: 0.92rem;
  color: var(--wp--preset--color--ink);
  margin: 0 0 1rem;
}

/* Out-of-zone delivery message */
.vb-no-ship {
  background: var(--wp--preset--color--blush);
  border-radius: 10px;
  padding: 0.8rem 1rem;
  font-size: 0.92rem;
  color: var(--wp--preset--color--ink);
}
.vb-no-ship a { color: var(--wp--preset--color--rose); }

/* Free-delivery progress nudge (rendered above the cart/checkout block) */
.vb-deliverybar {
  max-width: 1240px;
  margin: 0 auto 1.25rem;
  background: var(--wp--preset--color--cream);
  border: 1px solid var(--wp--preset--color--blush);
  border-radius: 12px;
  padding: 0.85rem 1.1rem;
}
.vb-deliverybar__msg {
  margin: 0 0 0.5rem;
  font-size: 0.95rem;
  color: var(--wp--preset--color--ink);
  text-align: center;
}
.vb-deliverybar__track {
  height: 8px;
  border-radius: 999px;
  background: var(--wp--preset--color--blush);
  overflow: hidden;
}
.vb-deliverybar__track > span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--wp--preset--color--rose);
  transition: width 0.4s var(--vb-ease);
}
/* When sitting over the order-summary panel (cart + checkout right column). */
.vb-deliverybar--summary {
  max-width: none;
  margin: 0 0 1rem;
  background: var(--wp--preset--color--white);
}

/* "Edit cart" affordance — a centered pill directly under the line items (works
   the same on desktop and the mobile collapsible summary). The summary stays
   read-only; this opens the slide-out cart drawer (proper − / + and remove),
   whose edits sync straight back into the checkout totals. */
.vb-editcart-row {
  display: flex;
  justify-content: center;
  padding: 0.35rem 0 0.7rem;
}
.vb-editcart {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  border: 1px solid var(--wp--preset--color--blush);
  border-radius: 999px;
  background: none;
  padding: 0.42rem 1rem;
  cursor: pointer;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  color: var(--wp--preset--color--ink);
  text-decoration: none;
  transition: border-color 0.15s var(--vb-ease), color 0.15s var(--vb-ease);
}
.vb-editcart svg { width: 14px; height: 14px; flex: none; }
.vb-editcart:hover { border-color: var(--wp--preset--color--rose); color: var(--wp--preset--color--rose); }

/* ---- "Delivery details" block (the gifting / delivery fields) ------------- */
/* Calmer rhythm between fields. */
.wp-block-woocommerce-checkout-additional-information-block .wc-block-components-text-input,
.wp-block-woocommerce-checkout-additional-information-block .wc-block-components-checkbox {
  margin-top: 1.05rem;
}

/* Draw a "Personal touches" sub-group divider + heading before the gift cluster,
   purely in CSS via the is-gift field's stable class (no JS, survives re-renders).
   After our field reorder, everything from here down is the gift/preferences cluster. */
.wc-block-components-address-form__valley-bloom-is-gift {
  margin-top: 1.9rem !important;
  padding-top: 1.5rem;
  border-top: 1px solid var(--wp--preset--color--blush);
}
.wc-block-components-address-form__valley-bloom-is-gift::before {
  content: "Personal touches";
  display: block;
  margin: 0 0 0.95rem;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wp--preset--color--stone);
}

/* On-brand checkboxes across the block checkout (rose tick, soft blush box). */
.wp-block-woocommerce-checkout .wc-block-components-checkbox__input {
  border-color: var(--wp--preset--color--blush);
  border-radius: 5px;
}
.wp-block-woocommerce-checkout .wc-block-components-checkbox__input:checked {
  background: var(--wp--preset--color--rose) !important;
  border-color: var(--wp--preset--color--rose) !important;
}
.wp-block-woocommerce-checkout .wc-block-components-checkbox__input:checked + .wc-block-components-checkbox__mark,
.wp-block-woocommerce-checkout .wc-block-components-checkbox__mark {
  fill: var(--wp--preset--color--cream);
  color: var(--wp--preset--color--cream);
}

/* Hide WooCommerce's generic "Add a note to your order" — redundant now that we
   have dedicated Card message + Delivery notes fields. */
.wp-block-woocommerce-checkout-order-note-block {
  display: none;
}

/* Mobile: full-width primary actions */
@media (max-width: 781px) {
  .wc-block-components-button.contained,
  .wc-block-components-checkout-place-order-button {
    width: 100% !important;
  }
  .wc-block-checkout__sidebar,
  .wp-block-woocommerce-cart-totals-block { padding: 1rem; }
}

/* --------------------------------------------------------------------------
   Shop filter bar — premium category pills + refined price
   -------------------------------------------------------------------------- */
.vb-shopbar {
  margin: 0 auto 0.75rem;
  padding-bottom: 1.4rem;
  border-bottom: 1px solid var(--wp--preset--color--blush);
}
.vb-shopbar .wc-block-product-filter-taxonomy__header,
.vb-shopbar .wp-block-heading { display: none; } /* chips are self-evident */

/* Category chips → soft pills */
.wc-block-product-filter-chips__items {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin: 0 0 1.1rem;
  padding: 0;
  list-style: none;
}
.wc-block-product-filter-chips__item {
  display: inline-flex;
  align-items: center;
  position: relative;
  padding: 0.46rem 1.05rem;
  border-radius: 999px;
  cursor: pointer;
  background: var(--wp--preset--color--cream);
  box-shadow: inset 0 0 0 1px var(--wp--preset--color--blush);
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.86rem;
  line-height: 1;
  color: var(--wp--preset--color--ink);
  transition: background-color 0.2s var(--vb-ease), color 0.2s var(--vb-ease), box-shadow 0.2s var(--vb-ease);
}
.wc-block-product-filter-chips__item:hover {
  box-shadow: inset 0 0 0 1px var(--wp--preset--color--rose);
}
.wc-block-product-filter-chips__item[aria-checked="true"],
.wc-block-product-filter-chips__item[aria-pressed="true"],
.wc-block-product-filter-chips__item.is-selected,
.wc-block-product-filter-chips__item--selected,
.wc-block-product-filter-chips__item:has(input:checked) {
  background: var(--wp--preset--color--rose);
  color: var(--wp--preset--color--cream);
  box-shadow: none;
}
.wc-block-product-filter-chips__item input {
  position: absolute;
  opacity: 0;
  inset: 0;
  margin: 0;
  cursor: pointer;
}

/* Price + active row */
.vb-shopbar__row {
  gap: 1.75rem;
  margin-top: 0.25rem;
}
.vb-shopbar .wc-block-product-filter-price { min-width: 230px; max-width: 340px; flex: 1 1 230px; }
.wc-block-product-filter-price-slider__range { accent-color: var(--wp--preset--color--rose); }
.wc-block-product-filter-price-slider .text,
.wc-block-product-filter-price-slider input {
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.85rem;
  color: var(--wp--preset--color--ink);
}

/* Active (removable) filter chips */
.wc-block-product-filter-removable-chips__items {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.wc-block-product-filter-removable-chips__item {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.3rem 0.75rem;
  border-radius: 999px;
  font-size: 0.8rem;
  background: var(--wp--preset--color--blush);
  color: var(--wp--preset--color--ink);
}

@media (max-width: 781px) {
  .vb-shopbar__row { flex-direction: column; align-items: flex-start; gap: 0.9rem; }
  .vb-shopbar .wc-block-product-filter-price { width: 100%; max-width: none; }
}

/* --------------------------------------------------------------------------
   Shop filters — bespoke on-brand pills (replaces the WC filter block UI)
   -------------------------------------------------------------------------- */
.vb-shopfilter {
  margin: 0 auto 1.75rem;
  padding-bottom: 1.4rem;
  border-bottom: 1px solid var(--wp--preset--color--blush);
}
.vb-shopfilter__pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}
.vb-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.5rem 1.1rem;
  border-radius: 999px;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.88rem;
  line-height: 1;
  text-decoration: none;
  color: var(--wp--preset--color--ink);
  background: transparent;
  box-shadow: inset 0 0 0 1px var(--wp--preset--color--blush);
  transition: background-color 0.2s var(--vb-ease), color 0.2s var(--vb-ease), box-shadow 0.2s var(--vb-ease);
}
.vb-pill:hover {
  box-shadow: inset 0 0 0 1px var(--wp--preset--color--rose);
  color: var(--wp--preset--color--rose);
}
.vb-pill.is-active {
  background: var(--wp--preset--color--rose);
  color: var(--wp--preset--color--cream);
  box-shadow: none;
}
.vb-shopfilter__price {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1rem;
}
.vb-shopfilter__label {
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.72rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--wp--preset--color--moss);
  margin-right: 0.35rem;
}
.vb-pill--sm { padding: 0.4rem 0.9rem; font-size: 0.82rem; }
.vb-shopfilter__controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; }
.vb-shopfilter__controls .vb-shopfilter__price { margin-top: 0; }
.vb-shopfilter__sort { display: flex; align-items: center; gap: 0.5rem; }
.vb-sortselect {
  border: 0; box-shadow: inset 0 0 0 1px var(--wp--preset--color--blush);
  border-radius: 999px; padding: 0.5rem 2rem 0.5rem 1.1rem;
  font-family: var(--wp--preset--font-family--inter); font-size: 0.85rem; color: var(--wp--preset--color--ink);
  background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23B76E64' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 0.85rem center;
  -webkit-appearance: none; appearance: none; cursor: pointer; line-height: 1;
}
.vb-sortselect:hover { box-shadow: inset 0 0 0 1px var(--wp--preset--color--rose); }
@media (max-width: 600px) {
  .vb-shopfilter__controls { flex-direction: column; align-items: flex-start; }
  .vb-sortselect { width: 100%; }
}

/* --------------------------------------------------------------------------
   Variation swatches — on-brand pills with inline price (product page)
   -------------------------------------------------------------------------- */
.vb-hidden-select {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.vb-swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0.15rem 0 0.5rem;
}
.vb-swatch {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.12rem;
  padding: 0.55rem 0.95rem;
  border: 0;
  border-radius: 14px;
  background: transparent;
  box-shadow: inset 0 0 0 1px var(--wp--preset--color--blush);
  cursor: pointer;
  font-family: var(--wp--preset--font-family--inter);
  text-align: left;
  transition: box-shadow 0.2s var(--vb-ease), background-color 0.2s var(--vb-ease);
}
.vb-swatch__name { font-size: 0.92rem; color: var(--wp--preset--color--ink); line-height: 1.1; }
.vb-swatch__price { font-size: 0.8rem; color: var(--wp--preset--color--moss); }
.vb-swatch:hover { box-shadow: inset 0 0 0 1px var(--wp--preset--color--rose); }
.vb-swatch.is-active {
  background: var(--wp--preset--color--blush);
  box-shadow: inset 0 0 0 2px var(--wp--preset--color--rose);
}
.vb-swatch.is-oos { opacity: 0.45; cursor: not-allowed; text-decoration: line-through; }

/* Tidy the classic variation row now that pills carry the choice. */
.woocommerce-variation-add-to-cart .reset_variations,
table.variations .label { font-family: var(--wp--preset--font-family--inter); }
@media (max-width: 781px) {
  .vb-swatch { flex: 1 1 auto; align-items: center; }
}

/* Build-a-Bouquet — extra stems stepper */
.vb-extra-stems { margin: 0.35rem 0 1.1rem; }
.vb-extra-stems__label {
  display: block;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.9rem;
  color: var(--wp--preset--color--ink);
  margin-bottom: 0.45rem;
}
.vb-extra-stems__label em { font-style: normal; color: var(--wp--preset--color--moss); font-size: 0.82rem; }
.vb-stepper {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  box-shadow: inset 0 0 0 1px var(--wp--preset--color--blush);
  overflow: hidden;
}
.vb-stepper__btn {
  width: 2.4rem;
  height: 2.4rem;
  border: 0;
  background: transparent;
  color: var(--wp--preset--color--ink);
  font-size: 1.2rem;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.15s var(--vb-ease);
}
.vb-stepper__btn:hover { background: var(--wp--preset--color--blush); }
.vb-extra-stems__qty {
  width: 3rem;
  text-align: center;
  border: 0;
  background: transparent;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 1rem;
  color: var(--wp--preset--color--ink);
  -moz-appearance: textfield;
}
.vb-extra-stems__qty::-webkit-outer-spin-button,
.vb-extra-stems__qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.vb-extra-stems__sum {
  display: block;
  margin-top: 0.55rem;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.85rem;
  color: var(--wp--preset--color--rose);
}

/* --------------------------------------------------------------------------
   Newsletter signup (footer + thank-you)
   -------------------------------------------------------------------------- */
.vb-news { margin: 1rem 0 0; max-width: 28rem; }
.vb-news__label {
  display: block;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.9rem;
  color: var(--wp--preset--color--ink);
  margin-bottom: 0.55rem;
}
.vb-news__row {
  display: flex;
  gap: 0.5rem;
  align-items: stretch;
}
.vb-news__hp {
  position: absolute !important;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
}
.vb-news__input {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0.6rem 0.9rem;
  border-radius: 999px;
  border: 0;
  box-shadow: inset 0 0 0 1px var(--wp--preset--color--blush);
  background: var(--wp--preset--color--cream);
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.92rem;
  color: var(--wp--preset--color--ink);
}
.vb-news__input:focus {
  outline: none;
  box-shadow: inset 0 0 0 1.5px var(--wp--preset--color--rose);
}
.vb-news__btn {
  flex: 0 0 auto;
  padding: 0.6rem 1.25rem;
  border: 0;
  border-radius: 999px;
  background: var(--wp--preset--color--rose);
  color: var(--wp--preset--color--cream);
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.9rem;
  cursor: pointer;
  transition: background-color 0.2s var(--vb-ease), opacity 0.2s var(--vb-ease);
}
.vb-news__btn:hover { background: var(--wp--preset--color--moss); }
.vb-news__btn:disabled { opacity: 0.6; cursor: default; }
.vb-news__msg { margin: 0.5rem 0 0; font-family: var(--wp--preset--font-family--inter); font-size: 0.82rem; color: var(--wp--preset--color--moss); }
.vb-news__msg.is-error { color: var(--wp--preset--color--rose); }
.vb-news__success {
  margin: 1rem 0 0;
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: 1.05rem;
  color: var(--wp--preset--color--moss);
}
/* Thank-you placement */
.vb-news-thanks {
  margin: 1.75rem auto 0;
  padding-top: 1.5rem;
  border-top: 1px solid var(--wp--preset--color--blush);
}
.vb-news-thanks .vb-news { margin-left: auto; margin-right: auto; }
@media (max-width: 600px) {
  .vb-news__row { flex-direction: column; }
  .vb-news__btn { width: 100%; }
}

/* Quick-add panel on shop/related/cross-sell grids. */
.vb-qa {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0.5rem 0 0.25rem;
  animation: vbFade 0.2s var(--vb-ease);
}
.vb-swatch--qa { padding: 0.4rem 0.7rem; border-radius: 12px; }
.vb-swatch--qa .vb-swatch__name { font-size: 0.82rem; }
.vb-swatch--qa .vb-swatch__price { font-size: 0.74rem; }
.vb-swatch--qa.is-loading { opacity: 0.5; pointer-events: none; }
.vb-qa__loading { font-family: var(--wp--preset--font-family--inter); font-size: 0.82rem; color: var(--wp--preset--color--stone); }
.vb-qa__done {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  text-align: center;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.88rem;
  color: var(--wp--preset--color--moss);
}
.vb-qa__view {
  display: inline-block;
  font-weight: 600;
  color: var(--wp--preset--color--rose);
  text-decoration: none;
}
.vb-qa__view:hover { color: var(--wp--preset--color--ink); }
@keyframes vbFade { from { opacity: 0; transform: translateY(-3px); } to { opacity: 1; transform: none; } }

/* --------------------------------------------------------------------------
   Cart cross-sells — give them room + on-brand heading (de-cluttered)
   -------------------------------------------------------------------------- */
.wp-block-woocommerce-cart-cross-sells-block {
  margin-top: 2.5rem;
  padding-top: 1.85rem;
  border-top: 1px solid var(--wp--preset--color--blush);
}
/* On-brand label for the upsell row (the native block ships no heading). */
.wp-block-woocommerce-cart-cross-sells-block::before {
  content: "Add a finishing touch";
  display: block;
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: 1.35rem;
  letter-spacing: 0.01em;
  color: var(--wp--preset--color--ink);
  margin: 0 0 1.25rem;
}
/* breathing room between the line items and the upsell row */
.wp-block-woocommerce-cart-items-block { padding-bottom: 0.25rem; }
@media (max-width: 781px) {
  /* The items live in an unclassed wrapper that goes display:block on mobile —
     target their direct parent and make it a 2-up grid. */
  :has( > .cross-sells-product ) {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 1.1rem !important;
  }
  .cross-sells-product {
    width: auto !important;
    max-width: none !important;
    flex: initial !important;
    margin: 0 !important;
  }
}

/* --------------------------------------------------------------------------
   Checkout — date picker note + "Add a finishing touch" upsell strip
   -------------------------------------------------------------------------- */
/* The "Requested date" field uses a bespoke calendar (vb-cal). Static label
   above + readonly text trigger (no native picker). */
.wc-block-components-address-form__valley-bloom-delivery-date {
  display: flex;
  flex-direction: column;
  position: relative;
}
.wc-block-components-address-form__valley-bloom-delivery-date label {
  order: -1;
  position: static !important;
  transform: none !important;
  max-width: none !important;
  font-size: 0.8rem !important;
  line-height: 1.25;
  padding: 0 0 0.35rem !important;
  color: var(--wp--preset--color--moss);
  white-space: normal;
  overflow: visible;
}
.wc-block-components-address-form__valley-bloom-delivery-date input {
  min-height: 2.9rem;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%235F6E51' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='12' height='12' rx='2'/%3E%3Cpath d='M3 8h12M6 2v3M12 2v3'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.85rem center;
}

/* --- Bespoke calendar popover --- */
.vb-cal {
  position: absolute;
  left: 0;
  top: calc(100% + 6px);
  z-index: 60;
  width: min(20rem, 100%);
  padding: 0.95rem;
  background: var(--wp--preset--color--cream);
  border: 1px solid var(--wp--preset--color--blush);
  border-radius: 16px;
  box-shadow: 0 14px 36px rgba(43, 39, 36, 0.16);
  font-family: var(--wp--preset--font-family--inter);
  animation: vbFade 0.16s var(--vb-ease);
}
.vb-cal__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.6rem;
}
.vb-cal__title {
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: 1.05rem;
  color: var(--wp--preset--color--ink);
}
.vb-cal__nav {
  width: 2rem;
  height: 2rem;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--wp--preset--color--ink);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.15s var(--vb-ease);
}
.vb-cal__nav:hover:not(:disabled) { background: var(--wp--preset--color--blush); }
.vb-cal__nav:disabled { opacity: 0.3; cursor: default; }
.vb-cal__grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
}
.vb-cal__dow {
  font-size: 0.68rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--wp--preset--color--moss);
  text-align: center;
  padding: 0.3rem 0 0.45rem;
}
.vb-cal__cell {
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--wp--preset--color--ink);
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.9rem;
  cursor: pointer;
  transition: background-color 0.15s var(--vb-ease), color 0.15s var(--vb-ease);
}
.vb-cal__cell.is-empty { visibility: hidden; cursor: default; }
.vb-cal__cell:hover:not(.is-disabled):not(.is-selected) { background: var(--wp--preset--color--blush); }
.vb-cal__cell.is-disabled { color: var(--wp--preset--color--stone); opacity: 0.4; cursor: default; }
.vb-cal__cell.is-selected { background: var(--wp--preset--color--rose); color: var(--wp--preset--color--cream); }
@media (max-width: 781px) {
  .vb-cal { width: 100%; }
  .vb-cal__cell { font-size: 0.95rem; }
}

.vb-checkout-upsell {
  max-width: 1240px;
  margin: 0 auto 2rem;
  padding-bottom: 1.6rem;
  border-bottom: 1px solid var(--wp--preset--color--blush);
}
.vb-checkout-upsell__title {
  font-family: var(--wp--preset--font-family--fraunces) !important;
  font-size: 1.3rem;
  margin: 0 0 1rem;
}
.vb-upsell-card { text-align: center; }
.vb-upsell-card .wc-block-components-product-button .wp-block-button__link,
.vb-upsell-card .wp-block-button__link {
  padding: 0.4rem 0.85rem;
  font-size: 0.82rem;
}
/* Desktop: even 4-up row. */
.vb-checkout-upsell .wp-block-woocommerce-product-template {
  display: flex;
  gap: 1.1rem;
}
.vb-checkout-upsell .vb-upsell-card { flex: 1 1 0; }
/* Mobile: slim horizontal scroll so it doesn't push the form down. */
@media (max-width: 781px) {
  .vb-checkout-upsell .wp-block-woocommerce-product-template {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 0.5rem;
    scroll-snap-type: x mandatory;
  }
  .vb-checkout-upsell .vb-upsell-card {
    flex: 0 0 46%;
    scroll-snap-align: start;
  }
}

/* --------------------------------------------------------------------------
   Mobile alignment fixes (header menu + product cards)
   -------------------------------------------------------------------------- */
/* (Product-card content is centered globally — see .vb-card above.) */

/* --------------------------------------------------------------------------
   Bespoke mobile menu — custom hamburger + full-screen boutique overlay.
   (Desktop keeps the WordPress inline nav; both are hidden by default and
   only swapped in at <=781px.)
   -------------------------------------------------------------------------- */
.vb-menu-toggle,
.vb-menu { display: none; }

.vb-menu-toggle {
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  width: 2.4rem;
  height: 2.4rem;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.vb-menu-toggle span {
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 2px;
  background: var(--wp--preset--color--ink);
}

.vb-menu {
  position: fixed;
  inset: 0;
  z-index: 100000;
  flex-direction: column;
  padding: 1.4rem clamp(1.5rem, 7vw, 2.5rem) 2.2rem;
  background: var(--wp--preset--color--cream);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: opacity 0.28s var(--vb-ease), transform 0.28s var(--vb-ease), visibility 0.28s var(--vb-ease);
}
.vb-menu.is-open { opacity: 1; visibility: visible; transform: none; }
.vb-menu__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.vb-menu__logo img { width: 150px; height: auto; display: block; }
.vb-menu__close {
  border: 0;
  background: transparent;
  color: var(--wp--preset--color--ink);
  font-size: 2rem;
  line-height: 1;
  width: 2.6rem;
  height: 2.6rem;
  cursor: pointer;
}
.vb-menu__nav {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.85rem;
}
.vb-menu__nav a {
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: clamp(1.7rem, 7vw, 2.2rem);
  font-weight: 500;
  letter-spacing: 0.01em;
  color: var(--wp--preset--color--ink);
  text-decoration: none;
  transition: color 0.2s var(--vb-ease);
}
.vb-menu__nav a:hover,
.vb-menu__nav a:focus { color: var(--wp--preset--color--rose); }
.vb-menu__util {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.85rem;
  margin-bottom: 1.4rem;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 1rem;
}
.vb-menu__util a {
  color: var(--wp--preset--color--ink);
  text-decoration: none;
}
.vb-menu__util a:hover { color: var(--wp--preset--color--rose); }
.vb-menu__dot { color: var(--wp--preset--color--stone); }
.vb-menu__foot { text-align: center; }
.vb-menu__social {
  display: flex;
  justify-content: center;
  gap: 1.4rem;
  margin-bottom: 0.5rem;
}
.vb-menu__social a {
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.82rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--wp--preset--color--moss);
  text-decoration: none;
}
.vb-menu__social a:hover { color: var(--wp--preset--color--rose); }
.vb-menu__loc {
  margin: 0;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.82rem;
  letter-spacing: 0.04em;
  color: var(--wp--preset--color--stone);
}

@media (max-width: 781px) {
  .vb-header .wp-block-navigation { display: none; }
  .vb-menu-toggle { display: inline-flex; }
  .vb-menu { display: flex; }
}

/* --------------------------------------------------------------------------
   Motion & micro-interactions (premium polish, reduced-motion aware)
   -------------------------------------------------------------------------- */
/* Product image hover zoom (clipped by a rounded frame). */
.vb-card .wc-block-components-product-image,
.vb-card .wp-block-woocommerce-product-image {
  overflow: hidden;
  border-radius: var(--vb-radius);
  display: block;
}
.vb-card .wc-block-components-product-image img,
.vb-card img {
  transition: transform 0.55s var(--vb-ease);
}
.vb-card:hover .wc-block-components-product-image img,
.vb-card:hover img { transform: scale(1.045); }

/* Button press feedback. */
.vb-hero__btn:active,
.vb-pop__btn:active,
.vb-news__btn:active,
.wp-block-button__link:active,
.wc-block-components-button:active { transform: translateY(1px); }

@media (prefers-reduced-motion: no-preference) {
  /* Hero entrance on load. */
  .vb-hero__content > * { animation: vbHeroIn 0.7s var(--vb-ease) both; }
  .vb-hero__content > *:nth-child(2) { animation-delay: 0.07s; }
  .vb-hero__content > *:nth-child(3) { animation-delay: 0.14s; }
  .vb-hero__content > *:nth-child(4) { animation-delay: 0.21s; }
  @keyframes vbHeroIn {
    from { opacity: 0; transform: translateY(14px); }
    to { opacity: 1; transform: none; }
  }

  /* Scroll-reveal — only hide once JS confirms support (.vb-js set in <head>). */
  .vb-js .vb-card,
  .vb-js .vb-cat,
  .vb-js main h2.wp-block-heading,
  .vb-js .vb-value-props .wp-block-column {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.7s var(--vb-ease), transform 0.7s var(--vb-ease);
  }
  .vb-js .vb-card.is-in,
  .vb-js .vb-cat.is-in,
  .vb-js main h2.wp-block-heading.is-in,
  .vb-js .vb-value-props .wp-block-column.is-in {
    opacity: 1;
    transform: none;
  }
}

/* --------------------------------------------------------------------------
   Trust: delivery ETA, accordions (core/details), "Our Promise" strip, FAQ
   -------------------------------------------------------------------------- */
.vb-eta {
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.92rem;
  color: var(--wp--preset--color--moss);
  margin: 0.55rem 0 1rem;
}

.vb-acc {
  border-top: 1px solid var(--wp--preset--color--blush);
  padding: 0.7rem 0;
}
.vb-acc summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  list-style: none;
  cursor: pointer;
  font-family: var(--wp--preset--font-family--inter);
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--wp--preset--color--ink);
}
.vb-acc summary::-webkit-details-marker { display: none; }
.vb-acc summary::after {
  content: "+";
  color: var(--wp--preset--color--rose);
  font-size: 1.25rem;
  line-height: 1;
}
.vb-acc[open] summary::after { content: "\2013"; }
.vb-acc p {
  margin: 0.6rem 0 0.15rem;
  font-size: 0.92rem;
  line-height: 1.6;
  color: var(--wp--preset--color--ink);
}

.vb-promise {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  max-width: 1240px;
  margin: 0 auto;
  padding: 1.85rem 0;
  border-top: 1px solid var(--wp--preset--color--blush);
  border-bottom: 1px solid var(--wp--preset--color--blush);
  text-align: center;
}
.vb-promise__mark { display: inline-flex; color: var(--wp--preset--color--moss); }
.vb-promise__mark svg { width: 30px; height: 30px; }
.vb-promise__title {
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: 1.1rem;
  font-weight: 500;
  margin: 0.55rem 0 0.35rem;
  color: var(--wp--preset--color--ink);
}
.vb-promise p {
  margin: 0 auto;
  max-width: 22rem;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.9rem;
  line-height: 1.55;
  color: var(--wp--preset--color--stone);
}
@media (max-width: 781px) {
  .vb-promise { grid-template-columns: 1fr; gap: 1.6rem; }
}

/* FAQ accordions (reuses .vb-acc) */
.vb-faq { max-width: 760px; margin: 0 auto; }
.vb-faq .vb-acc:last-child { border-bottom: 1px solid var(--wp--preset--color--blush); }
.vb-faq { margin-top: 2.5rem; }
.vb-faq > h2 { margin-bottom: 0.6rem; }

/* Fresh-flower guarantee badge — near the buy box on product pages. */
.vb-guarantee {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  margin: 0.5rem 0 1rem;
  padding: 0.8rem 1rem;
  border: 1px solid var(--wp--preset--color--sage);
  border-radius: 12px;
  background: var(--wp--preset--color--cream);
}
.vb-guarantee__icon { flex: 0 0 auto; width: 26px; height: 26px; color: var(--wp--preset--color--moss); margin-top: 1px; }
.vb-guarantee__text { margin: 0; font-family: var(--wp--preset--font-family--inter); font-size: 0.86rem; line-height: 1.55; color: var(--wp--preset--color--ink); }
.vb-guarantee__text strong { color: var(--wp--preset--color--rose); }

/* --------------------------------------------------------------------------
   My Account — premium, on-brand (classic WooCommerce account markup)
   -------------------------------------------------------------------------- */
.woocommerce-account h2,
.woocommerce-account h3,
.woocommerce-account legend {
  font-family: var(--wp--preset--font-family--fraunces);
  color: var(--wp--preset--color--ink);
}

/* Two-column layout — sidebar card + content card. Float-based (no :has) so it
   works regardless of WooCommerce's empty notices-wrapper child and older
   browsers. The nav/content classes only exist on the logged-in dashboard, so
   the login/register page is never affected. */
.woocommerce-account .woocommerce { max-width: var(--wp--style--global--wide-size, 1100px); margin-inline: auto; }
.woocommerce-account .woocommerce::after { content: ""; display: table; clear: both; }
@media (min-width: 783px) {
  /* Widen the account dashboard past the narrow reading width so a sidebar +
     content fit. Scoped to .woocommerce-account, so text pages are untouched. */
  .woocommerce-account .wp-block-post-content,
  .woocommerce-account .entry-content { max-width: 1080px !important; }
  .woocommerce-account .wp-block-post-content > .woocommerce,
  .woocommerce-account .entry-content > .woocommerce { max-width: none !important; }
  /* Override WooCommerce's residual 35/65 float widths with a fixed sidebar +
     a non-floated content block that fills the remaining width (BFC). */
  .woocommerce-account .woocommerce-MyAccount-navigation { float: left !important; width: 250px !important; margin-right: 2.25rem !important; }
  .woocommerce-account .woocommerce-MyAccount-content { float: none !important; width: auto !important; overflow: hidden; }
}

/* Sidebar navigation as a soft card */
.woocommerce-MyAccount-navigation {
  background: var(--wp--preset--color--white);
  border: 1px solid var(--wp--preset--color--blush);
  border-radius: 16px;
  padding: 0.5rem;
  box-shadow: 0 1px 6px rgba(43, 39, 36, 0.05);
}
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; }
.woocommerce-MyAccount-navigation li { margin: 0; }
.woocommerce-MyAccount-navigation li a {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.6rem 0.85rem;
  border-radius: 11px;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.95rem;
  color: var(--wp--preset--color--ink);
  text-decoration: none;
  transition: background-color 0.2s var(--vb-ease), color 0.2s var(--vb-ease);
}
/* Nav line-icons (inline SVG from navigation.php) inherit the link colour. */
.woocommerce-MyAccount-navigation .vb-nav-ico {
  display: inline-flex;
  flex: none;
  width: 18px;
  height: 18px;
  color: var(--wp--preset--color--stone);
  transition: color 0.2s var(--vb-ease);
}
.woocommerce-MyAccount-navigation .vb-nav-ico svg { width: 100%; height: 100%; }
.woocommerce-MyAccount-navigation li a:hover {
  background: var(--wp--preset--color--cream);
  color: var(--wp--preset--color--rose);
}
.woocommerce-MyAccount-navigation li a:hover .vb-nav-ico { color: var(--wp--preset--color--rose); }
.woocommerce-MyAccount-navigation li.is-active a {
  background: var(--wp--preset--color--blush);
  color: var(--wp--preset--color--rose);
  font-weight: 600;
}
.woocommerce-MyAccount-navigation li.is-active .vb-nav-ico { color: var(--wp--preset--color--rose); }
/* Set the log-out link apart with a hairline divider. */
.woocommerce-MyAccount-navigation-link--customer-logout {
  margin-top: 0.35rem;
  padding-top: 0.35rem;
  border-top: 1px solid var(--wp--preset--color--blush);
}
.woocommerce-MyAccount-navigation-link--customer-logout a,
.woocommerce-MyAccount-navigation-link--customer-logout .vb-nav-ico { color: var(--wp--preset--color--stone); }
.woocommerce-MyAccount-navigation-link--customer-logout a:hover,
.woocommerce-MyAccount-navigation-link--customer-logout a:hover .vb-nav-ico { color: var(--wp--preset--color--rose); }

/* Content panel */
.woocommerce-MyAccount-content {
  background: var(--wp--preset--color--white);
  border: 1px solid var(--wp--preset--color--blush);
  border-radius: 16px;
  padding: 1.9rem 2.1rem;
  box-shadow: 0 1px 6px rgba(43, 39, 36, 0.05);
  font-family: var(--wp--preset--font-family--inter);
  color: var(--wp--preset--color--ink);
  line-height: 1.6;
}
.woocommerce-MyAccount-content > p:first-child { margin-top: 0; }
.woocommerce-MyAccount-content a:not(.button):not(.woocommerce-button) { color: var(--wp--preset--color--rose); }

/* Dashboard: warm greeting + quick-link cards (myaccount/dashboard.php override). */
.vb-dash-hi {
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: 1.55rem;
  line-height: 1.2;
  color: var(--wp--preset--color--ink);
  margin: 0 0 0.25rem;
}
.vb-dash-sub { color: var(--wp--preset--color--stone); margin: 0 0 1.6rem; }
.vb-dash-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.vb-dash-card {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  padding: 1.05rem 1.15rem;
  border: 1px solid var(--wp--preset--color--blush);
  border-radius: 14px;
  background: var(--wp--preset--color--cream);
  text-decoration: none !important;
  transition: border-color 0.2s var(--vb-ease), transform 0.2s var(--vb-ease), box-shadow 0.2s var(--vb-ease);
}
.vb-dash-card:hover {
  border-color: var(--wp--preset--color--rose);
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(43, 39, 36, 0.08);
}
.vb-dash-card__icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 42px;
  height: 42px;
  border-radius: 11px;
  background: var(--wp--preset--color--white);
  color: var(--wp--preset--color--rose);
  border: 1px solid var(--wp--preset--color--blush);
}
.vb-dash-card__icon svg { width: 21px; height: 21px; }
.vb-dash-card__text { display: flex; flex-direction: column; gap: 0.1rem; flex: 1; min-width: 0; }
.vb-dash-card__title {
  font-family: var(--wp--preset--font-family--fraunces);
  font-size: 1.08rem;
  color: var(--wp--preset--color--ink);
}
.vb-dash-card__sub { font-size: 0.82rem; color: var(--wp--preset--color--stone); }
.vb-dash-card__arrow {
  flex: none;
  color: var(--wp--preset--color--rose);
  font-size: 1.1rem;
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity 0.2s var(--vb-ease), transform 0.2s var(--vb-ease);
}
.vb-dash-card:hover .vb-dash-card__arrow { opacity: 1; transform: translateX(0); }
@media (max-width: 600px) { .vb-dash-grid { grid-template-columns: 1fr; } }

/* In-account notices (e.g. "No order has been made yet") */
.woocommerce-account .woocommerce-message,
.woocommerce-account .woocommerce-info,
.woocommerce-account .woocommerce-Message {
  background: var(--wp--preset--color--cream);
  border: 1px solid var(--wp--preset--color--blush);
  border-left: 3px solid var(--wp--preset--color--rose);
  border-radius: 12px;
  color: var(--wp--preset--color--ink);
  font-family: var(--wp--preset--font-family--inter);
}

/* Orders / downloads table */
.woocommerce-account table.shop_table,
.woocommerce-account .woocommerce-orders-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 0;
}
.woocommerce-account table.shop_table thead th,
.woocommerce-orders-table thead th {
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--wp--preset--color--stone);
  text-align: left;
  padding: 0.5rem 0.8rem 0.7rem;
  border-bottom: 1px solid var(--wp--preset--color--blush);
}
.woocommerce-account table.shop_table tbody td,
.woocommerce-orders-table tbody td {
  padding: 1rem 0.8rem;
  border-bottom: 1px solid rgba(242, 218, 211, 0.6);
  font-size: 0.95rem;
  vertical-align: middle;
  color: var(--wp--preset--color--ink);
}
.woocommerce-orders-table tbody tr:last-child td { border-bottom: 0; }

/* Buttons */
.woocommerce-account .button,
.woocommerce-account button[type="submit"],
.woocommerce-account .woocommerce-Button,
.woocommerce-account a.woocommerce-button {
  display: inline-block;
  background-color: var(--wp--preset--color--rose) !important;
  color: var(--wp--preset--color--cream) !important;
  border-radius: 10px !important;
  border: 0 !important;
  padding: 0.6rem 1.2rem !important;
  font-family: var(--wp--preset--font-family--inter);
  font-weight: 600;
  text-decoration: none;
  transition: background-color 0.2s var(--vb-ease);
}
.woocommerce-account .button:hover,
.woocommerce-account button[type="submit"]:hover,
.woocommerce-account a.woocommerce-button:hover { background-color: var(--wp--preset--color--ink) !important; }

/* Inputs / selects */
.woocommerce-account .woocommerce form .form-row input.input-text,
.woocommerce-account input[type="text"],
.woocommerce-account input[type="email"],
.woocommerce-account input[type="password"],
.woocommerce-account input[type="tel"],
.woocommerce-account select {
  border-radius: 10px;
  border: 1px solid var(--wp--preset--color--blush);
  padding: 0.7rem 0.9rem;
  background: var(--wp--preset--color--cream);
  font-family: var(--wp--preset--font-family--inter);
}
.woocommerce-account .woocommerce-form-row label,
.woocommerce-account .form-row label {
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.88rem;
  color: var(--wp--preset--color--ink);
}

/* Edit-account / address: first & last name side by side on desktop */
.woocommerce-EditAccountForm .form-row-first,
.woocommerce-address-fields .form-row-first { width: 48%; float: left; margin-right: 4%; }
.woocommerce-EditAccountForm .form-row-last,
.woocommerce-address-fields .form-row-last { width: 48%; float: left; }
.woocommerce-EditAccountForm .clear,
.woocommerce-address-fields .clear { clear: both; }
.woocommerce-EditAccountForm fieldset {
  margin-top: 1.6rem; padding-top: 1.2rem;
  border: 0; border-top: 1px solid var(--wp--preset--color--blush);
}
.woocommerce-EditAccountForm fieldset legend { padding: 0; }

/* Saved addresses as cards — flex (reliable in-order placement; grid was
   mis-placing the two cards because of WooCommerce's residual column CSS). */
.woocommerce-Addresses { display: flex !important; flex-wrap: wrap; gap: 1.5rem; margin-top: 0.5rem; }
.woocommerce-Address {
  flex: 1 1 0 !important; /* equal-width side-by-side; ignores WC's residual fixed width */
  float: none !important;
  width: auto !important;
  min-width: 0 !important;
  box-sizing: border-box;
  background: var(--wp--preset--color--cream);
  border: 1px solid var(--wp--preset--color--blush);
  border-radius: 12px;
  padding: 1.4rem 1.5rem;
}
.woocommerce-Address-title h2,
.woocommerce-Address-title h3 { font-size: 1.05rem; }
.woocommerce-Address-title .edit {
  flex: none;
  font-family: var(--wp--preset--font-family--inter);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--wp--preset--color--rose);
  text-decoration: none;
  white-space: nowrap;
}
.woocommerce-Address-title { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.woocommerce-Address-title h2,
.woocommerce-Address-title h3 { margin: 0; font-size: 1.15rem; }
.woocommerce-Address address { font-style: normal; line-height: 1.7; color: var(--wp--preset--color--ink); margin-top: 0.5rem; }

/* ---- Mobile ---- */
@media (max-width: 782px) {
  .woocommerce-account .woocommerce-MyAccount-navigation { float: none !important; width: auto !important; margin-right: 0 !important; margin-bottom: 1.4rem; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .woocommerce-account .woocommerce-MyAccount-content { float: none !important; width: auto !important; }
  .woocommerce-MyAccount-navigation ul { display: flex; gap: 0.4rem; }
  .woocommerce-MyAccount-navigation li a { white-space: nowrap; padding: 0.55rem 0.85rem; font-size: 0.9rem; }
  .woocommerce-MyAccount-content { padding: 1.3rem 1.2rem; }
  .woocommerce-Addresses { flex-direction: column; }
  /* stack order rows with their column labels */
  .woocommerce-orders-table thead { display: none; }
  .woocommerce-orders-table tbody tr { display: block; padding: 0.9rem 0; border-bottom: 1px solid var(--wp--preset--color--blush); }
  .woocommerce-orders-table tbody td {
    display: flex; justify-content: space-between; align-items: center; gap: 1rem;
    padding: 0.45rem 0; border: 0; text-align: right;
  }
  .woocommerce-orders-table tbody td::before {
    content: attr(data-title);
    font-weight: 600; color: var(--wp--preset--color--stone);
    text-transform: uppercase; font-size: 0.7rem; letter-spacing: 0.08em; text-align: left;
  }
  .woocommerce-account .woocommerce-EditAccountForm .form-row-first,
  .woocommerce-account .woocommerce-EditAccountForm .form-row-last,
  .woocommerce-account .woocommerce-address-fields .form-row-first,
  .woocommerce-account .woocommerce-address-fields .form-row-last { width: 100% !important; float: none !important; margin-right: 0 !important; }
}

/* Empty cart — warmer, on-brand */
.wc-block-cart__empty-cart__title { font-family: var(--wp--preset--font-family--fraunces) !important; }

/* ============ Start-a-Subscription guided builder ============ */
.vb-sb { max-width: 860px; margin: 0 auto; font-family: var(--wp--preset--font-family--inter); }
.vb-sb__steps { display: flex; gap: 0.4rem; list-style: none; margin: 0 0 1.8rem; padding: 0; counter-reset: vbsb; }
.vb-sb__steps li { flex: 1 1 0; display: flex; align-items: center; justify-content: center; gap: 0.45rem; padding: 0.6rem 0.4rem; font-size: 0.82rem; font-weight: 600; color: var(--wp--preset--color--stone); border-bottom: 2px solid var(--wp--preset--color--blush); cursor: default; text-align: center; }
.vb-sb__steps li span { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 999px; background: var(--wp--preset--color--blush); color: var(--wp--preset--color--stone); font-size: 0.75rem; flex: 0 0 auto; }
.vb-sb__steps li.is-done, .vb-sb__steps li.is-active { color: var(--wp--preset--color--ink); border-bottom-color: var(--wp--preset--color--rose); cursor: pointer; }
.vb-sb__steps li.is-active span, .vb-sb__steps li.is-done span { background: var(--wp--preset--color--rose); color: #fff; }

.vb-sb__panel { animation: vbsbfade 0.3s ease; }
@keyframes vbsbfade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.vb-sb__h { font-family: var(--wp--preset--font-family--fraunces); font-weight: 500; font-size: 1.6rem; margin: 0 0 0.4rem; color: var(--wp--preset--color--ink); }
.vb-sb__lead { color: var(--wp--preset--color--stone); margin: 0 0 1.3rem; line-height: 1.6; }
.vb-sb__lead strong { color: var(--wp--preset--color--moss); }
.vb-sb__back { background: none; border: 0; color: var(--wp--preset--color--rose); font-family: var(--wp--preset--font-family--inter); font-weight: 600; font-size: 0.85rem; cursor: pointer; padding: 0; margin: 0 0 0.9rem; }

/* Step 1 — bouquet grid */
.vb-sb__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.9rem; }
.vb-sb__product { position: relative; display: flex; flex-direction: column; gap: 0.2rem; text-align: center; padding: 0; border: 1.5px solid var(--wp--preset--color--blush); border-radius: 14px; background: var(--wp--preset--color--white); cursor: pointer; overflow: hidden; transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease; }
.vb-sb__product:hover { border-color: var(--wp--preset--color--rose); transform: translateY(-2px); box-shadow: 0 8px 22px rgba(43,39,36,0.08); }
.vb-sb__product.is-choice { border-color: var(--wp--preset--color--sage); border-width: 2px; }
.vb-sb__tag { position: absolute; top: 8px; left: 8px; z-index: 2; background: var(--wp--preset--color--sage); color: #fff; font-size: 0.62rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 0.2rem 0.5rem; border-radius: 999px; }
.vb-sb__product-img { display: block; width: 100%; aspect-ratio: 1 / 1; background-size: cover; background-position: center; background-color: var(--wp--preset--color--cream); }
.vb-sb__product-name { font-family: var(--wp--preset--font-family--fraunces); font-size: 1rem; color: var(--wp--preset--color--ink); margin-top: 0.55rem; padding: 0 0.4rem; }
.vb-sb__product-sub { font-size: 0.76rem; color: var(--wp--preset--color--stone); padding: 0 0.5rem 0.8rem; line-height: 1.4; }

/* Steps 2 & 3 — option cards */
.vb-sb__sizes, .vb-sb__freqs { display: flex; flex-direction: column; gap: 0.6rem; }
.vb-sb__chosen { font-weight: 600; color: var(--wp--preset--color--moss); }
.vb-sb__opt { display: flex; align-items: center; gap: 0.8rem; width: 100%; text-align: left; padding: 0.95rem 1.1rem; border: 1.5px solid var(--wp--preset--color--blush); border-radius: 12px; background: var(--wp--preset--color--white); cursor: pointer; transition: border-color 0.15s ease, box-shadow 0.15s ease; }
.vb-sb__opt:hover { border-color: var(--wp--preset--color--rose); box-shadow: inset 0 0 0 1px var(--wp--preset--color--rose); }
.vb-sb__opt-main { flex: 1 1 auto; display: flex; flex-direction: column; gap: 0.15rem; }
.vb-sb__opt-title { font-weight: 600; font-size: 1rem; color: var(--wp--preset--color--ink); }
.vb-sb__opt-desc { font-size: 0.8rem; color: var(--wp--preset--color--stone); }
.vb-sb__opt-price { font-weight: 700; font-size: 1rem; color: var(--wp--preset--color--ink); flex: 0 0 auto; text-align: right; }
.vb-sb__opt-price del { color: var(--wp--preset--color--stone); font-weight: 400; font-size: 0.85rem; margin-right: 0.25rem; }
.vb-sb__opt-note { font-size: 0.7rem; color: var(--wp--preset--color--moss); flex: 0 0 auto; text-align: right; white-space: nowrap; }

/* Step 4 — review */
.vb-sb__sum-card { display: flex; align-items: center; gap: 1rem; padding: 1.1rem; border: 1px solid var(--wp--preset--color--blush); border-radius: 14px; background: var(--wp--preset--color--white); margin-bottom: 1.1rem; }
.vb-sb__sum-img { width: 76px; height: 76px; border-radius: 10px; background-size: cover; background-position: center; flex: 0 0 auto; background-color: var(--wp--preset--color--cream); }
.vb-sb__sum-info { flex: 1 1 auto; display: flex; flex-direction: column; gap: 0.2rem; }
.vb-sb__sum-name { font-family: var(--wp--preset--font-family--fraunces); font-size: 1.15rem; color: var(--wp--preset--color--ink); }
.vb-sb__sum-line { font-size: 0.88rem; color: var(--wp--preset--color--stone); }
.vb-sb__sum-save { font-size: 0.74rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--wp--preset--color--moss); }
.vb-sb__sum-price { text-align: right; flex: 0 0 auto; }
.vb-sb__sum-price strong { display: block; font-size: 1.2rem; color: var(--wp--preset--color--ink); }
.vb-sb__sum-price span { font-size: 0.72rem; color: var(--wp--preset--color--stone); }
.vb-sb__date { width: 100%; box-sizing: border-box; border: 1.5px solid var(--wp--preset--color--blush); border-radius: 12px; padding: 0.85rem 1rem; font-family: var(--wp--preset--font-family--inter); font-size: 1rem; color: var(--wp--preset--color--ink); background: var(--wp--preset--color--white); }
.vb-sb__date:focus { outline: none; border-color: var(--wp--preset--color--rose); box-shadow: inset 0 0 0 1px var(--wp--preset--color--rose); }
.vb-sb__datepretty { margin: 0.7rem 0 1.2rem; font-weight: 600; color: var(--wp--preset--color--moss); min-height: 1.2rem; }
.vb-sb__datenext:disabled { opacity: 0.45; cursor: default; }
.vb-sb__account { background: var(--wp--preset--color--cream); border-radius: 12px; padding: 0.9rem 1.1rem; margin-bottom: 1.1rem; font-size: 0.88rem; line-height: 1.55; color: var(--wp--preset--color--ink); }
.vb-sb__account a { color: var(--wp--preset--color--rose); }
.vb-sb__cta { display: block; width: 100%; border: 0; border-radius: 12px; padding: 1rem; background: var(--wp--preset--color--rose); color: var(--wp--preset--color--cream); font-family: var(--wp--preset--font-family--inter); font-weight: 600; font-size: 1.05rem; cursor: pointer; }
.vb-sb__cta:hover { background: var(--wp--preset--color--ink); }
.vb-sb__fine { text-align: center; font-size: 0.74rem; color: var(--wp--preset--color--stone); margin: 0.7rem 0 0; }

@media (max-width: 640px) {
  .vb-sb__steps li { flex-direction: column; gap: 0.2rem; font-size: 0.66rem; }
  .vb-sb__grid { grid-template-columns: repeat(2, 1fr); gap: 0.6rem; }
  .vb-sb__h { font-size: 1.35rem; }
  .vb-sb__opt { padding: 0.8rem 0.9rem; }
  .vb-sb__sum-card { flex-wrap: wrap; }
}
