.gif-showcase__grid{display:grid;gap:var(--space-lg);min-width:0}.gif-showcase__intro{max-width:34rem}.gif-showcase__heading{margin-block-end:var(--space-sm)}.gif-showcase__text{color:var(--color-muted);font-size:var(--text-lg)}.gif-showcase__cta{margin-block-start:var(--space-md)}.gif-showcase__clips{display:grid;grid-template-columns:repeat(var(--clip-count, 1),minmax(0,1fr));gap:var(--space-sm);min-width:0}.gif-showcase__grid--single .gif-showcase__clips{max-width:26rem}.gif-showcase__clips--scroll{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:72%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:1px}.gif-showcase__clips--scroll::-webkit-scrollbar{display:none}.gif-showcase__clips--scroll>.gif-showcase__clip{scroll-snap-align:start}.gif-showcase__clip{display:flex;flex-direction:column;gap:var(--space-xs);min-width:0;margin:0}.gif-showcase__frame{--tick-color: var(--color-accent-text);position:relative;aspect-ratio:var(--clip-ratio, 4 / 5);overflow:hidden;border:var(--border-width) solid var(--color-line-strong);border-radius:var(--radius-card-sm);background-color:var(--color-media, var(--color-raised))}.gif-showcase__frame.ticks:before{top:0;right:0;bottom:0;left:0}.gif-showcase__video,.gif-showcase__placeholder{position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%;height:100%;object-fit:cover}.gif-showcase__placeholder{fill:var(--color-muted);opacity:.4}.gif-showcase__tag{position:absolute;inset-block-start:var(--space-xs);inset-inline-start:var(--space-xs);z-index:1;padding:.25rem .5rem;border:var(--border-width) solid var(--color-line);background-color:color-mix(in srgb,var(--color-background) 82%,transparent);color:var(--color-ink);font-size:var(--text-2xs);letter-spacing:var(--tracking-mono)}.gif-showcase__toggle{position:absolute;inset-block-end:var(--space-xs);inset-inline-end:var(--space-xs);z-index:3;display:grid;place-items:center;width:var(--tap-target);height:var(--tap-target);padding:0;border:var(--border-width) solid var(--color-line);border-radius:var(--radius-button, 2px);background-color:color-mix(in srgb,var(--color-background) 82%,transparent);color:var(--color-ink);cursor:pointer;transition:background-color var(--duration-fast) ease,color var(--duration-fast) ease,border-color var(--duration-fast) ease}.gif-showcase__toggle .icon{width:1rem;height:1rem}.gif-showcase__toggle:hover{border-color:var(--color-accent);background-color:var(--color-accent);color:var(--color-accent-contrast, #111)}.gif-showcase__icon{display:grid;place-items:center}.gif-showcase__icon--pause,[data-playing] .gif-showcase__icon--play{display:none}[data-playing] .gif-showcase__icon--pause{display:grid}[data-clip]:not([data-playing]) .gif-showcase__toggle{inset-block-end:50%;inset-inline-end:50%;width:3.5rem;height:3.5rem;transform:translate(50%,50%);border-color:var(--color-ink);background-color:var(--color-ink);color:var(--color-background)}[data-clip]:not([data-playing]) .gif-showcase__toggle .icon{width:1.25rem;height:1.25rem}.gif-showcase__caption{display:grid;gap:var(--space-3xs)}.gif-showcase__label{margin:0;font-size:var(--text-2xs);letter-spacing:var(--tracking-mono);text-transform:uppercase;color:var(--color-muted)}.gif-showcase__product{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem var(--space-xs);min-height:var(--tap-target);color:var(--color-ink);text-decoration:none}.gif-showcase__title{font-weight:var(--font-body-weight-medium, 500)}.gif-showcase__product .icon{width:1rem;height:1rem;margin-inline-start:auto;color:var(--color-accent-text);transition:transform var(--duration-fast) var(--ease-out)}@media(hover:hover){.gif-showcase__product:hover .gif-showcase__title{text-decoration:underline;text-underline-offset:.2em}.gif-showcase__product:hover .icon{transform:translate(3px)}}@media(min-width:750px){.gif-showcase__clips--scroll{grid-auto-flow:row;grid-template-columns:repeat(var(--clip-count, 1),minmax(0,1fr));grid-auto-columns:auto;overflow:visible}.gif-showcase__clips{gap:var(--space-md)}}@media(min-width:990px){.gif-showcase__grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:center;gap:var(--space-xl)}.gif-showcase__grid--single{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.gif-showcase__grid--single .gif-showcase__clips{justify-self:end;width:100%}}@media(prefers-reduced-motion:reduce){.gif-showcase__toggle,.gif-showcase__product .icon{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/5/assets/section-gif-showcase.css.map */