.portfolio-masonry{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:240px;gap:4px}.portfolio-grid-item{position:relative;overflow:hidden;border-radius:var(--radius);cursor:pointer;transition:opacity .4s ease,filter .4s ease}.portfolio-masonry:hover .portfolio-grid-item{opacity:.35;filter:grayscale(.6)}.portfolio-masonry:hover .portfolio-grid-item:hover{opacity:1;filter:grayscale(0)}.portfolio-grid-item.hiding{opacity:0!important;pointer-events:none}.portfolio-grid-item.hidden{display:none}.portfolio-grid-item.showing{animation:fadeIn .35s ease forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.portfolio-grid-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.25,.46,.45,.94)}.portfolio-grid-item:hover img{transform:scale(1.05)}.portfolio-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.6) 0%,transparent 50%);display:flex;flex-direction:column;justify-content:flex-end;padding:1.25rem;color:#fff;opacity:0;transition:opacity .35s ease;pointer-events:none}.portfolio-grid-item:hover .portfolio-overlay{opacity:1}.portfolio-title{font-weight:700;font-size:1.1rem;margin-bottom:.15rem}.lightbox-info{position:absolute;bottom:0;left:0;right:0;padding:1.5rem 2rem;background:linear-gradient(to top,rgba(0,0,0,.7) 0%,transparent 100%);color:#fff;text-align:center;pointer-events:none}.lightbox-info .lightbox-title{font-family:var(--font-heading);font-weight:700;font-size:1.2rem;margin-bottom:.2rem}.lightbox-info .lightbox-cat{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;opacity:.7}@media(max-width:900px){.portfolio-masonry{grid-template-columns:repeat(2,1fr);grid-auto-rows:200px}}@media(max-width:520px){.portfolio-masonry{grid-template-columns:1fr;grid-auto-rows:250px}}