/* skin-94 — Petal & Stem */

.wpopw-vw {
  --vw-font: 'Jost';
  --vw-rose: #c98a8a;
  --vw-rose-deep: #b06f6f;
  --vw-sage: var(--wpopw-accent, #8a9a7b);
  --vw-sage-deep: #6f8060;
  --vw-cream: #f5efe6;
  --vw-cream-2: #efe6d8;
  --vw-bark: #4a423a;
  --vw-bark-soft: #8d8175;
  --vw-green: #5a9b6e;
}

/* ============================================================
   LAUNCHER  (leaf-shaped: one rounded corner squared off)
   ============================================================ */
.wpopw-vw .vw-launcher {
  position: fixed;
  right: 26px;
  bottom: 26px;
  width: 72px;
  height: 72px;
  border-radius: 50% 50% 50% 8px;
  border: none;
  padding: 0;
  cursor: pointer;
  z-index: 2147483000;
  background: var(--vw-sage);
  box-shadow: 0 16px 38px rgba(138,154,123,.5), 0 4px 12px rgba(74,66,58,.2);
  overflow: visible;
  transition: transform .35s cubic-bezier(.34,1.56,.64,1), opacity .25s ease;
  animation: vw-grow .6s cubic-bezier(.34,1.56,.64,1) both;
}
@keyframes vw-grow {
  from { transform: scale(0) rotate(20deg); opacity: 0; }
  to   { transform: scale(1) rotate(0); opacity: 1; }
}
.wpopw-vw .vw-launcher:hover { transform: scale(1.06) rotate(-3deg); }
.wpopw-vw .vw-launcher.vw-hidden { opacity: 0; transform: scale(.4); pointer-events: none; }

.wpopw-vw .vw-launcher__ring {
  position: absolute;
  inset: -6px;
  border-radius: 50% 50% 50% 8px;
  border: 2px solid var(--vw-rose);
  z-index: -1;
  animation: vw-bloom 2.8s ease-out infinite;
}
@keyframes vw-bloom {
  0% { transform: scale(.9); opacity: .7; }
  75% { transform: scale(1.32); opacity: 0; }
  100% { transform: scale(1.32); opacity: 0; }
}
.wpopw-vw .vw-launcher__media {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center 20%;
  border-radius: 50% 50% 50% 8px;
}
.wpopw-vw .vw-launcher__badge {
  position: absolute;
  top: -6px; right: -6px;
  width: 26px; height: 26px;
  border-radius: 50%;
  background: var(--vw-rose);
  border: 3px solid var(--vw-cream);
  z-index: 3;
  display: grid;
  place-items: center;
  color: #fff;
  box-shadow: 0 3px 8px rgba(74,66,58,.25);
  animation: vw-sway 3s ease-in-out infinite;
}
@keyframes vw-sway { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-3px)} }
.wpopw-vw .vw-launcher__play {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #fff;
  z-index: 2;
  filter: drop-shadow(0 2px 6px rgba(74,66,58,.5));
  pointer-events: none;
}

/* Tooltip */
.wpopw-vw .vw-tooltip {
  position: fixed;
  right: 112px;
  bottom: 42px;
  max-width: 232px;
  background: var(--vw-cream);
  color: var(--vw-bark);
  padding: 14px 18px 14px 16px;
  border-radius: 18px 18px 4px 18px;
  box-shadow: 0 16px 40px rgba(74,66,58,.25);
  font-size: 14px;
  line-height: 1.5;
  font-weight: 500;
  z-index: 2147483000;
  border: 1.5px solid var(--vw-sage);
  animation: vw-tip-in .45s ease .9s both;
}
.wpopw-vw .vw-tooltip strong { color: var(--vw-rose-deep); font-weight: 700; }
.wpopw-vw .vw-tooltip::after {
  content: "";
  position: absolute;
  right: -8px; bottom: 12px;
  width: 15px; height: 15px;
  background: var(--vw-cream);
  border-right: 1.5px solid var(--vw-sage);
  border-bottom: 1.5px solid var(--vw-sage);
  transform: rotate(-45deg);
  border-radius: 0 0 4px 0;
}
.wpopw-vw .vw-tooltip__close {
  position: absolute;
  top: -10px; left: -10px;
  width: 24px; height: 24px;
  border-radius: 50%;
  border: 2px solid var(--vw-cream);
  background: var(--vw-bark);
  color: var(--vw-cream);
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
  display: grid;
  place-items: center;
  box-shadow: 0 4px 10px rgba(74,66,58,.3);
}
@keyframes vw-tip-in {
  from { opacity: 0; transform: translateY(10px) scale(.92); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.wpopw-vw .vw-tooltip.vw-hidden { display: none; }

/* ============================================================
   PANEL
   ============================================================ */
.wpopw-vw .vw-panel {
  position: fixed;
  right: 26px;
  bottom: 26px;
  width: 380px;
  height: min(660px, calc(100dvh - 40px));
  max-height: calc(100dvh - 40px);
  border-radius: 28px 28px 28px 6px;
  overflow: hidden;
  background: var(--wpopw-panel-bg, #2d2a25);
  box-shadow: 0 34px 84px rgba(74,66,58,.42), 0 0 0 6px var(--vw-cream), 0 0 0 8px var(--vw-sage);
  z-index: 2147483001;
  transform: translateY(24px) scale(.96);
  opacity: 0;
  pointer-events: none;
  transition: transform .4s cubic-bezier(.22,1,.36,1), opacity .3s ease;
}
.wpopw-vw .vw-panel.vw-open {
  transform: translateY(0) scale(1);
  opacity: 1;
  pointer-events: auto;
}

.wpopw-vw .vw-video {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  background: #2d2a25;
  cursor: pointer;
}

/* scrims */
.wpopw-vw .vw-scrim-top {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 124px;
  background: linear-gradient(to bottom, rgba(45,42,37,.6), transparent);
  pointer-events: none;
  z-index: 2;
}
.wpopw-vw .vw-scrim-bottom {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 65%;
  background: linear-gradient(to top, rgba(38,35,30,.95) 0%, rgba(38,35,30,.7) 36%, transparent 100%);
  pointer-events: none;
  z-index: 2;
}

/* top bar */
.wpopw-vw .vw-top {
  position: absolute;
  top: 0; left: 0; right: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 16px 0;
  z-index: 6;
}
.wpopw-vw .vw-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--vw-cream);
  pointer-events: none;
}
.wpopw-vw .vw-brand__logo {
  width: 34px; height: 34px;
  border-radius: 50% 50% 50% 6px;
  background: var(--vw-rose);
  display: grid;
  place-items: center;
  color: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,.25);
}
.wpopw-vw .vw-brand__logo img { width:100%; height:100%; object-fit:cover; border-radius:inherit; }
.wpopw-vw .vw-brand__name {
  font-weight: 600;
  font-size: 16px;
  letter-spacing: .01em;
  text-shadow: 0 1px 4px rgba(0,0,0,.4);
}
.wpopw-vw .vw-brand__name em { font-style: italic; color: var(--vw-rose); }
.wpopw-vw .vw-brand__name small {
  display: block;
  font-size: 9px;
  font-weight: 500;
  opacity: .85;
  letter-spacing: .26em;
  text-transform: uppercase;
}
.wpopw-vw .vw-top__actions { display: flex; gap: 9px; }

.wpopw-vw .vw-iconbtn {
  width: 40px; height: 40px;
  border-radius: 50%;
  border: none;
  background: rgba(245,239,230,.2);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: var(--vw-cream);
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: background .2s ease, transform .15s ease, color .2s;
}
.wpopw-vw .vw-iconbtn:hover { background: var(--vw-rose); color: #fff; transform: scale(1.08); }
.wpopw-vw .vw-iconbtn:active { transform: scale(.94); }
.wpopw-vw .vw-iconbtn svg { width: 20px; height: 20px; display: block; }

/* center play/pause */
.wpopw-vw .vw-centerbtn {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 78px; height: 78px;
  border-radius: 50%;
  border: 2px solid rgba(245,239,230,.45);
  background: rgba(201,138,138,.82);
  color: #fff;
  cursor: pointer;
  display: grid;
  place-items: center;
  z-index: 5;
  box-shadow: 0 10px 30px rgba(201,138,138,.45);
  transition: opacity .25s ease, transform .25s ease, background .2s;
}
.wpopw-vw .vw-centerbtn:hover { background: var(--vw-rose-deep); transform: translate(-50%,-50%) scale(1.08); }
.wpopw-vw .vw-centerbtn.vw-faded {
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%,-50%) scale(1.28);
}
.wpopw-vw .vw-centerbtn svg { width: 32px; height: 32px; }

/* progress bar */
.wpopw-vw .vw-progress {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 4px;
  background: rgba(245,239,230,.2);
  z-index: 7;
  cursor: pointer;
}
.wpopw-vw .vw-progress__fill {
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, var(--vw-sage), var(--vw-rose));
  transition: width .1s linear;
}

/* bottom content stack */
.wpopw-vw .vw-bottom {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 0 16px 18px;
  z-index: 6;
  display: flex;
  flex-direction: column;
  gap: 13px;
}
.wpopw-vw .vw-headline {
  font-size: 16px;
  font-weight: 500;
  margin: 0;
  color: var(--vw-cream);
  line-height: 1.4;
  text-shadow: 0 2px 8px rgba(0,0,0,.5);
  transition: opacity .3s ease, transform .3s ease;
}
.wpopw-vw .vw-headline em { font-style: italic; color: var(--vw-rose); }
.wpopw-vw .vw-headline span { font-style: italic; color: var(--vw-rose); }
.wpopw-vw .vw-headline.vw-q-hidden {
  opacity: 0;
  transform: translateY(16px);
  pointer-events: none;
}

/* brand wordmark fades with promo text during playback */
.wpopw-vw .vw-brand {
  transition: opacity .3s ease, transform .3s ease;
}
.wpopw-vw .vw-brand.vw-q-hidden {
  opacity: 0;
  transform: translateY(-12px);
  pointer-events: none;
}

/* questions */
.wpopw-vw .vw-questions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  transition: opacity .3s ease, transform .3s ease;
}
.wpopw-vw .vw-questions.vw-q-hidden {
  opacity: 0;
  transform: translateY(16px);
  pointer-events: none;
}
.wpopw-vw .vw-pill {
  border: 1.5px solid rgba(245,239,230,.35);
  background: rgba(245,239,230,.1);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: var(--vw-cream);
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  padding: 9px 15px;
  border-radius: 999px 999px 999px 4px;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease, transform .15s ease, color .2s;
  white-space: nowrap;
}
.wpopw-vw .vw-pill:hover { background: rgba(245,239,230,.22); transform: translateY(-2px); }
.wpopw-vw .vw-pill.vw-active {
  background: var(--vw-sage);
  border-color: var(--vw-cream);
  color: #fff;
  font-weight: 600;
  box-shadow: 0 6px 18px rgba(138,154,123,.55);
}

/* CTAs */
.wpopw-vw .vw-ctas { display: flex; gap: 10px; }
.wpopw-vw .vw-cta {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 12px;
  border-radius: 16px 16px 16px 4px;
  font-family: inherit;
  font-size: 14.5px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .2s ease, filter .2s ease;
}
.wpopw-vw .vw-cta svg { width: 19px; height: 19px; flex: none; }
.wpopw-vw .vw-cta:active { transform: scale(.97); }
.wpopw-vw .vw-cta--wa {
  background: var(--wpopw-wa, #5a9b6e);
  color: #fff;
  box-shadow: 0 8px 22px rgba(90,155,110,.45);
}
.wpopw-vw .vw-cta--wa:hover { filter: brightness(1.06); transform: translateY(-2px); }
.wpopw-vw .vw-cta--call {
  background: var(--wpopw-call, #f5efe6);
  color: var(--vw-bark);
  box-shadow: 0 8px 22px rgba(0,0,0,.22);
}
.wpopw-vw .vw-cta--call:hover { filter: brightness(1.02); transform: translateY(-2px); }

/* responsive: full screen under 480px */
@media (max-width: 480px) {
  .wpopw-vw .vw-panel {
    right: 0; bottom: 0; left: 0; top: 0;
    width: 100%; height: 100dvh;
    max-height: none;
    border-radius: 0;
    box-shadow: none;
  }
  .wpopw-vw .vw-launcher { right: 18px; bottom: 18px; }
  .wpopw-vw .vw-tooltip { right: 100px; bottom: 34px; }
}

@media (prefers-reduced-motion: reduce) {
  .wpopw-vw .vw-launcher__ring, .wpopw-vw .vw-launcher__badge { animation: none; }
}
