.nojs .portfolio [data-content=filter]{display:none!important}.portfolio [data-content=filter]{display:flex;flex-wrap:wrap;gap:var(--size-grid-gap);justify-content:center;margin-bottom:2rem}.portfolio [data-content=filter] button{cursor:pointer}.portfolio [data-content=projects]{display:grid;gap:var(--size-grid-gap);list-style:none inside none}.project.filtered{display:none}.project.span2{grid-column:span 2}.project a{display:block;width:100%;height:100%;text-decoration:none}.project a:focus{outline:4px solid var(--color-accent-2-1);outline-offset:0px}.project figure{display:grid;grid-template-rows:minmax(1px,1fr) auto;width:100%;height:100%;overflow:hidden}.project+.project{margin-top:0}.project img{grid-column:1;grid-row:1/span 2;width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.project a:hover img{transform:scale(1.05)}.project figcaption{z-index:1;grid-column:1;grid-row:2;display:grid;gap:.1rem;padding:.4rem;line-height:1.2em;background-color:rgba(100,100,100,.8);color:#fff}.project h3,.project h3+span{white-space:pre;overflow-x:hidden;text-overflow:ellipsis;line-height:1.2em;text-shadow:0 0 4px #222}@media (min-width:900px){.portfolio [data-content=filter] button{font-size:var(--font-size-normal-2)}.portfolio [data-content=projects]{grid-template-columns:repeat(4,minmax(1rem,1fr))}.project{height:calc((var(--computed-max-width) - (3 * var(--size-grid-gap)))/ 4)}.project h3{font-size:clamp(var( --font-size-large-2 ), 2vw, var( --font-size-large-3 ))}.project h3+span{font-size:clamp(var( --font-size-large-1 ), 1.2vw, var( --font-size-large-2 ))}}@media (max-width:899px){.portfolio [data-content=projects]{grid-template-columns:repeat(2,minmax(1rem,1fr))}.project{height:calc((var(--computed-max-width) - var(--size-grid-gap))/ 2)}.project h3{font-size:clamp(var( --font-size-normal-4 ), 4vw, var( --font-size-large-2 ))}.project h3+span{font-size:clamp(var( --font-size-normal-3 ), 3vw, var( --font-size-large-1 ))}}