.sf-demo{display:flex;flex-wrap:wrap;align-items:stretch;gap:1rem;margin:.4rem 0 1.8rem;text-align:left}.sf-demo__btn{display:inline-flex;align-items:center;justify-content:center;gap:.8rem;padding:1.1rem 1.9rem;border:1px solid rgb(var(--sf-accent-rgb));background:rgb(var(--sf-accent-rgb));color:#000;font-family:var(--font-heading-family, inherit);font-size:1.2rem;font-weight:700;letter-spacing:.14em;line-height:1;text-transform:uppercase;text-decoration:none;transition:background .15s ease,color .15s ease,box-shadow .15s ease}.sf-demo__btn:hover,.sf-demo__btn:focus-visible{background:transparent;color:rgb(var(--sf-accent-rgb));box-shadow:0 0 0 1px rgb(var(--sf-accent-rgb)),0 0 22px rgba(var(--sf-accent-rgb),.35)}.sf-demo__play{display:inline-flex;flex:none}.sf-demo__play svg{width:.9rem;height:1.1rem;fill:currentColor}.sf-demo__pw{display:inline-flex;align-items:center;gap:.85rem;padding:.85rem 1.3rem;border:1px solid rgba(var(--sf-accent-rgb),.5);background:rgba(var(--sf-accent-rgb),.06);color:#fff;line-height:1;cursor:pointer;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}.sf-demo__pw:hover,.sf-demo__pw:focus-visible{border-color:rgb(var(--sf-accent-rgb));background:rgba(var(--sf-accent-rgb),.12);box-shadow:0 0 18px rgba(var(--sf-accent-rgb),.25)}.sf-demo__pw-label{font-family:var(--font-body-family, inherit);font-size:1rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;opacity:.6}.sf-demo__pw-code{font-family:ui-monospace,SF Mono,SFMono-Regular,Menlo,Consolas,Liberation Mono,monospace;font-size:1.35rem;font-variant-numeric:tabular-nums;letter-spacing:.06em;color:rgb(var(--sf-accent-rgb))}.sf-demo__pw-copy{display:inline-flex;flex:none}.sf-demo__pw-copy svg{width:1.15rem;height:1.15rem;fill:currentColor;opacity:.55;transition:opacity .15s ease}.sf-demo__pw:hover .sf-demo__pw-copy svg,.sf-demo__pw:focus-visible .sf-demo__pw-copy svg{opacity:1}.sf-demo__pw.is-copied{border-color:rgb(var(--sf-accent-rgb));background:rgba(var(--sf-accent-rgb),.14)}.sf-demo__pw.is-copied .sf-demo__pw-label{color:rgb(var(--sf-accent-rgb));opacity:1}@media screen and (max-width:480px){.sf-demo{flex-direction:column;align-items:stretch}.sf-demo__btn,.sf-demo__pw{width:100%;justify-content:center}}@media(prefers-reduced-motion:reduce){.sf-demo__btn,.sf-demo__pw,.sf-demo__pw-copy svg{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/sf-product-demo.css.map */