/* Velvet Chair design pill, shared by every /preview/ page (engine business + personal pages, and the legacy designs,
   which link this file too). Desktop: the full label, bottom-left. Phones (≤760px): a compact "Velvet Chair · $price"
   chip docked bottom-left above the safe area. At every width it stays hidden until the hero has scrolled past
   (js/vc-pill.js adds .is-on), so it never covers the hero lede, buttons or stats. The full label stays in the accessibility tree (visually
   hidden), and the chip shows itself on keyboard focus. The footer reserves room so it never covers the last line. */
.vc-pill{position:fixed;left:14px;bottom:14px;z-index:250;max-width:calc(100% - 28px);font:600 11px/1.3 system-ui,-apple-system,sans-serif;letter-spacing:.04em;color:#f6e3c8;background:#140c12;border:1px solid rgba(227,195,157,.45);padding:9px 14px;border-radius:99px;text-decoration:none;box-shadow:0 10px 30px -10px rgba(0,0,0,.5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vc-pill:hover{background:#2a1822}
.vc-pill__s{display:none}
/* at every width the pill waits until the hero has scrolled past (desktop heroes put headlines at the bottom-left too) */
:is(html.js,html.vc-pill-js) body :is(.vc-pill,.vc-ribbon){transition:opacity .25s ease,transform .25s ease}
:is(html.js,html.vc-pill-js) body :is(.vc-pill,.vc-ribbon):not(.is-on):not(:focus-visible){opacity:0;transform:translateY(calc(100% + 20px));pointer-events:none}
@media (prefers-reduced-motion:reduce){:is(html.js,html.vc-pill-js) body :is(.vc-pill,.vc-ribbon){transition:none}}
@media (max-width:760px){
  html body :is(.vc-pill,.vc-ribbon){position:fixed;left:calc(10px + env(safe-area-inset-left,0px));right:auto;top:auto;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:250;max-width:calc(100% - 20px);
    display:inline-flex;align-items:center;gap:0;margin:0;padding:7px 12px;font:600 11px/1.2 system-ui,-apple-system,sans-serif;letter-spacing:.04em;color:#f6e3c8;background:#140c12;
    border:1px solid rgba(227,195,157,.45);border-radius:99px;box-shadow:0 8px 22px -10px rgba(0,0,0,.55);backdrop-filter:none;-webkit-backdrop-filter:none}
  html body :is(.vc-pill,.vc-ribbon) > :not(.vc-pill__s):not(.vc-pill__l){display:none}
  html body .vc-pill__s{display:inline-flex;align-items:center;gap:6px}
  html body .vc-pill__s i{width:7px;height:7px;border-radius:50%;background:#e3c39d;flex:none}
  html body .vc-pill__l{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
  .foot{padding-bottom:calc(52px + env(safe-area-inset-bottom,0px))}
}