.portfolio-gallery-wrap{margin-block:40px}.gallery-heading{margin-bottom:24px}.gallery-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}.gallery-filter{cursor:pointer;padding:6px 16px;font-size:.8rem;letter-spacing:.04em;border:1px solid #ccc;border-radius:20px;background:transparent;transition:background .2s ease,color .2s ease,border-color .2s ease}.gallery-filter:hover,.gallery-filter.is-active{background:#111;color:#fff;border-color:#111}.portfolio-grid{display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}.portfolio-grid[data-cols="2"]{grid-template-columns:repeat(2,1fr)}.portfolio-grid[data-cols="3"]{grid-template-columns:repeat(3,1fr)}.portfolio-grid[data-cols="4"]{grid-template-columns:repeat(4,1fr)}@media(max-width:1000px){.portfolio-grid,.portfolio-grid[data-cols="3"],.portfolio-grid[data-cols="4"]{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.portfolio-grid,.portfolio-grid[data-cols="2"],.portfolio-grid[data-cols="3"],.portfolio-grid[data-cols="4"]{grid-template-columns:1fr}}.portfolio-item{position:relative;overflow:hidden;border-radius:4px;background:#f2f2f2;aspect-ratio:1 / 1;cursor:pointer;opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s ease}.portfolio-grid[data-ratio=square] .portfolio-item{aspect-ratio:1 / 1}.portfolio-grid[data-ratio=landscape] .portfolio-item{aspect-ratio:4 / 3}.portfolio-grid[data-ratio=portrait] .portfolio-item{aspect-ratio:3 / 4}.portfolio-grid[data-ratio=wide] .portfolio-item{aspect-ratio:16 / 9}.portfolio-item.portfolio-visible{opacity:1;transform:translateY(0)}.portfolio-item.gallery-hidden{display:none}.portfolio-item img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease,filter .35s ease}.portfolio-item:hover img{transform:scale(1.05);filter:brightness(.88)}.portfolio-caption{position:absolute;bottom:0;left:0;right:0;padding:12px 14px;background:linear-gradient(transparent,#000000b8);color:#fff;font-size:.875rem;line-height:1.35;opacity:0;transform:translateY(8px);transition:opacity .28s ease,transform .28s ease;pointer-events:none}.portfolio-item:hover .portfolio-caption{opacity:1;transform:translateY(0)}
/*# sourceMappingURL=/cdn/shop/t/20/assets/portfolio-gallery.css.map */
