/*!
 * Themeasy — Infinite Drag Canvas
 *
 * An infinite, two-axis draggable plane of images. The default layout is a
 * plain, centered static grid — fully readable with no JS, in the editor
 * preview, and whenever GSAP is absent. The frontend script promotes it to
 * canvas mode (the --ready modifier): the viewport clips to a fixed height,
 * the tile is cloned into a lattice, and only transforms move afterwards
 * (plane pan, per-item parallax). The column stagger and the edge fade are
 * canvas-mode-only so the static grid stays clean and complete.
 *
 * @author Themeasy
 * @link https://themeasy.co
 * @since 1.0.0
 */
.tms-drag-canvas{--tms-drag-canvas-item-w:18rem;--tms-drag-canvas-ratio:3 / 4;--tms-drag-canvas-gap:1.5rem;--tms-drag-canvas-stagger:3rem;--tms-drag-canvas-height:80vh;--tms-drag-canvas-fade:6rem;--tms-drag-canvas-zoom:1.05;width:100%;position:relative}.tms-drag-canvas__tile{justify-content:center;gap:var(--tms-drag-canvas-gap,1.5rem);flex-wrap:wrap;display:flex}.tms-drag-canvas__column{gap:var(--tms-drag-canvas-gap,1.5rem);width:min(var(--tms-drag-canvas-item-w,18rem), 100%);flex-direction:column;flex:none;display:flex}.tms-drag-canvas__item{position:relative}.tms-drag-canvas__surface{outline:none;display:block;position:relative}.tms-drag-canvas__media{aspect-ratio:var(--tms-drag-canvas-ratio,3 / 4);background:var(--tms-surface-color,#f2f3f5);border-radius:var(--tms-radius-lg,1rem);display:block;position:relative;overflow:hidden}.tms-drag-canvas__media .tms-drag-canvas__img{object-fit:cover;width:100%;height:100%;transition:transform var(--tms-transition-medium,.4s ease), filter var(--tms-transition-medium,.4s ease);-webkit-user-drag:none;display:block}.tms-drag-canvas__item:hover .tms-drag-canvas__img,.tms-drag-canvas__item:focus-within .tms-drag-canvas__img{transform:scale(var(--tms-drag-canvas-zoom,1.05))}.tms-drag-canvas__surface:focus-visible .tms-drag-canvas__media{outline:2px solid var(--tms-primary-color,#6a5cff);outline-offset:3px}.tms-drag-canvas__caption{max-width:calc(100% - 1.5rem);font-family:var(--tms-accent-font,var(--tms-heading-font,inherit));letter-spacing:.06em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;color:var(--tms-bg-color,#fff);background:#14161cb8;background:color-mix(in srgb, var(--tms-heading-color,#16181f) 72%, transparent);border-radius:var(--tms-radius-pill,999px);pointer-events:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:.375rem .75rem;font-size:.75rem;font-weight:600;line-height:1.2;display:inline-block;position:absolute;bottom:.75rem;overflow:hidden}.tms-drag-canvas__caption:not(:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:.75rem}.tms-drag-canvas__caption:not(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi))){left:.75rem}.tms-drag-canvas__caption:-webkit-any(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:.75rem}.tms-drag-canvas__caption:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){right:.75rem}.tms-drag-canvas--caption-hover .tms-drag-canvas__caption{opacity:0;transition:opacity var(--tms-transition-base,.3s ease), translate var(--tms-transition-base,.3s ease);translate:0 .375rem}.tms-drag-canvas--caption-hover .tms-drag-canvas__item:hover .tms-drag-canvas__caption,.tms-drag-canvas--caption-hover .tms-drag-canvas__item:focus-within .tms-drag-canvas__caption{opacity:1;translate:0}.tms-drag-canvas--ready .tms-drag-canvas__viewport{height:var(--tms-drag-canvas-height,80vh);cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.tms-drag-canvas--ready.tms-drag-canvas--touch-pan-x .tms-drag-canvas__viewport{touch-action:pan-y}.tms-drag-canvas--ready.tms-drag-canvas--dragging .tms-drag-canvas__viewport{cursor:grabbing}.tms-drag-canvas--ready.tms-drag-canvas--dragging .tms-drag-canvas__plane{pointer-events:none}.tms-drag-canvas--ready .tms-drag-canvas__stage{position:absolute;top:0;bottom:0;left:0;right:0}.tms-drag-canvas--ready .tms-drag-canvas__plane{will-change:transform;position:absolute;top:0;left:0}.tms-drag-canvas--ready .tms-drag-canvas__tile{width:max-content;flex-wrap:nowrap;justify-content:flex-start;align-items:flex-start;padding-block-end:var(--tms-drag-canvas-gap,1.5rem);padding-inline-end:var(--tms-drag-canvas-gap,1.5rem);position:absolute;top:0;left:0}.tms-drag-canvas--ready .tms-drag-canvas__column{width:var(--tms-drag-canvas-item-w,18rem)}.tms-drag-canvas--ready .tms-drag-canvas__column:nth-child(2n){translate:0 var(--tms-drag-canvas-stagger,3rem)}.tms-drag-canvas--ready.tms-drag-canvas--fade .tms-drag-canvas__stage{-webkit-mask-image:linear-gradient(to right, transparent, #000 var(--tms-drag-canvas-fade,6rem), #000 calc(100% - var(--tms-drag-canvas-fade,6rem)), transparent), linear-gradient(to bottom, transparent, #000 var(--tms-drag-canvas-fade,6rem), #000 calc(100% - var(--tms-drag-canvas-fade,6rem)), transparent);-webkit-mask-composite:source-in;-webkit-mask-image:linear-gradient(to right, transparent, #000 var(--tms-drag-canvas-fade,6rem), #000 calc(100% - var(--tms-drag-canvas-fade,6rem)), transparent), linear-gradient(to bottom, transparent, #000 var(--tms-drag-canvas-fade,6rem), #000 calc(100% - var(--tms-drag-canvas-fade,6rem)), transparent);mask-image:linear-gradient(to right, transparent, #000 var(--tms-drag-canvas-fade,6rem), #000 calc(100% - var(--tms-drag-canvas-fade,6rem)), transparent), linear-gradient(to bottom, transparent, #000 var(--tms-drag-canvas-fade,6rem), #000 calc(100% - var(--tms-drag-canvas-fade,6rem)), transparent);-webkit-mask-composite:source-in;mask-composite:intersect}.tms-drag-canvas__hint{display:none}.tms-drag-canvas--ready .tms-drag-canvas__hint{z-index:3;font-family:var(--tms-accent-font,var(--tms-heading-font,inherit));letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;color:var(--tms-bg-color,#fff);background:#14161cc7;background:color-mix(in srgb, var(--tms-heading-color,#16181f) 78%, transparent);border-radius:var(--tms-radius-pill,999px);opacity:.95;pointer-events:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:opacity var(--tms-transition-medium,.4s ease), visibility var(--tms-transition-medium,.4s ease);padding:.5rem 1rem;font-size:.75rem;font-weight:600;line-height:1.2;animation:2.6s ease-in-out infinite tms-drag-canvas-hint-nudge;display:inline-block;position:absolute;bottom:1.25rem;left:50%;translate:-50%}.tms-drag-canvas--ready .tms-drag-canvas__hint.tms-drag-canvas__hint--hidden{visibility:hidden;opacity:0}@keyframes tms-drag-canvas-hint-nudge{0%,to{translate:-50%}50%{translate:-50% -.375rem}}@media (max-width:1024px){.tms-drag-canvas{--tms-drag-canvas-item-w:15rem}}@media (max-width:767px){.tms-drag-canvas{--tms-drag-canvas-item-w:12rem;--tms-drag-canvas-gap:1rem;--tms-drag-canvas-stagger:2rem;--tms-drag-canvas-fade:4rem}}@media (prefers-reduced-motion:reduce){.tms-drag-canvas__img,.tms-drag-canvas--caption-hover .tms-drag-canvas__caption{transition:none}.tms-drag-canvas__item:hover .tms-drag-canvas__img,.tms-drag-canvas__item:focus-within .tms-drag-canvas__img{transform:none}.tms-drag-canvas--ready .tms-drag-canvas__hint{animation:none}}