/*!
 * Themeasy — Bento Gallery
 *
 * Photo-first asymmetric CSS-grid mosaic with per-item column/row spans,
 * figure/figcaption captions (label + title) over a gradient scrim, a grouped
 * lightbox overlay anchor with a corner hint chip, and a CSS hover zoom.
 *
 * Layering:
 * - Structure (grid template, spans, captions, lightbox links) is pure CSS and
 *   always present, so the widget is fully usable with no JavaScript.
 * - Motion (scroll parallax, staggered reveal) is layered on by GSAP and gated
 *   behind the --static (editor) and reduced-motion conditions in the JS. The
 *   parallax overscan scale is applied by the JS only, so a no-JS visitor sees
 *   the images uncropped. The CSS keeps every tile visible by default.
 * - The __media-inner layer deliberately carries NO CSS transition: it is the
 *   GSAP parallax target, and a transition there would fight the scrubbed
 *   transform. The hover zoom lives on the <img> instead.
 *
 * Tokens consumed: --tms-primary-color, --tms-heading-color, --tms-accent-font,
 * --tms-surface-color, --tms-white-color, --tms-radius-lg, --tms-font-size-xs,
 * --tms-font-size-md, --tms-bold-font-weight, --tms-heading-font,
 * --tms-heading-font-weight (public --tms-* design API).
 *
 * @author Themeasy
 * @link https://themeasy.co
 * @since 1.0.0
 */
.tms-bento-gallery{--tms-bento-gallery-accent:var(--tms-primary-color,#5b6cff);--tms-bento-gallery-radius:var(--tms-radius-lg,20px);--tms-bento-gallery-ease:cubic-bezier(.22, 1, .36, 1);width:100%;position:relative}.tms-bento-gallery__grid{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:220px;gap:16px;display:grid}.tms-bento-gallery__item{grid-column:span 1;grid-row:span var(--tms-bento-gallery-rspan,1);border-radius:var(--tms-bento-gallery-radius);background-color:var(--tms-surface-color,#12131a);isolation:isolate;transition:border-color .4s var(--tms-bento-gallery-ease), box-shadow .4s var(--tms-bento-gallery-ease);margin:0;position:relative;overflow:hidden}.tms-bento-gallery__media{z-index:1;border-radius:inherit;position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden}.tms-bento-gallery__media-inner{position:absolute;top:0;bottom:0;left:0;right:0}.tms-bento-gallery:not(.tms-bento-gallery--static) .tms-bento-gallery__media-inner{will-change:transform}.tms-bento-gallery__media-inner .tms-bento-gallery__image{object-fit:cover;width:100%;height:100%;transition:transform .6s var(--tms-bento-gallery-ease);display:block;transform:scale(1)}.tms-bento-gallery--zoom .tms-bento-gallery__item:hover .tms-bento-gallery__image,.tms-bento-gallery--zoom .tms-bento-gallery__item:focus-within .tms-bento-gallery__image{transform:scale(1.06)}.tms-bento-gallery__placeholder{background:linear-gradient(135deg, color-mix(in srgb, var(--tms-bento-gallery-accent) 18%, var(--tms-surface-color,#12131a)), var(--tms-surface-color,#12131a) 70%);position:absolute;top:0;bottom:0;left:0;right:0}.tms-bento-gallery__scrim{z-index:2;pointer-events:none;position:absolute;top:0;bottom:0;left:0;right:0}.tms-bento-gallery__scrim:before{content:"";background-image:linear-gradient(#0000 22%,#08090e1f 45%,#08090ec7);position:absolute;top:0;bottom:0;left:0;right:0}.tms-bento-gallery--scrim-custom .tms-bento-gallery__scrim:before{content:none}.tms-bento-gallery__caption{left:0;right:0;z-index:3;flex-direction:column;align-items:flex-start;gap:4px;padding:14px;display:flex;position:absolute;bottom:0}.tms-bento-gallery__label{font-family:var(--tms-accent-font);font-size:var(--tms-font-size-xs,.75rem);font-weight:var(--tms-bold-font-weight,700);letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb, var(--tms-white-color,#fff) 72%, transparent);display:block}.tms-bento-gallery__title{font-family:var(--tms-heading-font,inherit);font-size:var(--tms-font-size-md,1rem);font-weight:var(--tms-heading-font-weight,600);color:var(--tms-white-color,#fff);line-height:1.35;display:block}.tms-bento-gallery--captions-hover .tms-bento-gallery__scrim{opacity:0;transition:opacity .4s var(--tms-bento-gallery-ease)}.tms-bento-gallery--captions-hover .tms-bento-gallery__caption{opacity:0;transition:opacity .4s var(--tms-bento-gallery-ease), transform .4s var(--tms-bento-gallery-ease);transform:translateY(10px)}.tms-bento-gallery--captions-hover .tms-bento-gallery__item:hover .tms-bento-gallery__scrim,.tms-bento-gallery--captions-hover .tms-bento-gallery__item:focus-within .tms-bento-gallery__scrim{opacity:1}.tms-bento-gallery--captions-hover .tms-bento-gallery__item:hover .tms-bento-gallery__caption,.tms-bento-gallery--captions-hover .tms-bento-gallery__item:focus-within .tms-bento-gallery__caption{opacity:1;transform:translateY(0)}.tms-bento-gallery__hint{z-index:3;pointer-events:none;width:2.4em;height:2.4em;color:var(--tms-white-color,#fff);-webkit-backdrop-filter:blur(6px);opacity:0;transition:opacity .4s var(--tms-bento-gallery-ease), transform .4s var(--tms-bento-gallery-ease);background-color:#ffffff29;border-radius:50%;font-size:12px;position:absolute;top:10px;right:10px;transform:scale(.85)}.tms-bento-gallery__hint:before,.tms-bento-gallery__hint:after{content:"";background-color:currentColor;border-radius:1px;position:absolute;top:50%;left:50%}.tms-bento-gallery__hint:before{width:1em;height:2px;transform:translate(-50%,-50%)}.tms-bento-gallery__hint:after{width:2px;height:1em;transform:translate(-50%,-50%)}.tms-bento-gallery__item:hover .tms-bento-gallery__hint,.tms-bento-gallery__item:focus-within .tms-bento-gallery__hint{opacity:1;transform:scale(1)}.tms-bento-gallery__link{z-index:4;position:absolute;top:0;bottom:0;left:0;right:0}.tms-bento-gallery__link:focus-visible{outline:2px solid var(--tms-bento-gallery-accent);outline-offset:-3px;border-radius:inherit}.tms-bento-gallery__link-label{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.tms-bento-gallery--revealing .tms-bento-gallery__item{opacity:0}@media (hover:none){.tms-bento-gallery--captions-hover .tms-bento-gallery__scrim{opacity:1}.tms-bento-gallery--captions-hover .tms-bento-gallery__caption{opacity:1;transform:translateY(0)}.tms-bento-gallery__hint{opacity:1;transform:scale(1)}}@media (min-width:768px){.tms-bento-gallery__item{grid-column:span var(--tms-bento-gallery-cspan,1)}.tms-bento-gallery__caption{padding:20px}.tms-bento-gallery__hint{font-size:14px;top:14px;right:14px}}@media (prefers-reduced-motion:reduce){.tms-bento-gallery__item,.tms-bento-gallery__image,.tms-bento-gallery__scrim,.tms-bento-gallery__caption,.tms-bento-gallery__hint{transition:none!important}.tms-bento-gallery--zoom .tms-bento-gallery__item:hover .tms-bento-gallery__image,.tms-bento-gallery--zoom .tms-bento-gallery__item:focus-within .tms-bento-gallery__image{transform:none}.tms-bento-gallery--revealing .tms-bento-gallery__item{opacity:1}}