.portfolio-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-flow:row;grid-auto-rows:var(--portfolio-row,clamp(200px,23vw,310px));gap:var(--portfolio-gap,32px)}
.portfolio-tile{min-width:0;min-height:0;display:flex;flex-direction:column;grid-column:span 4;grid-row:span 1;text-decoration:none;color:inherit}
.portfolio-large{grid-column:span 8;grid-row:span 2}.portfolio-wide{grid-column:span 12;grid-row:span 1}.portfolio-tall{grid-column:span 4;grid-row:span 2}
.portfolio-image{position:relative;flex:1;min-height:0;background:#deded7;overflow:hidden}
.portfolio-image>img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .45s ease}
.portfolio-caption{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-top:15px;min-width:0}
.portfolio-caption h2{font-size:16px;line-height:1.4;font-weight:500;letter-spacing:-.03em;overflow-wrap:anywhere;margin:0}
.portfolio-caption>span{font-size:11px;color:#70746d;text-align:right;line-height:1.5}
.portfolio-open{position:absolute;right:16px;bottom:16px;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#f2f0e9;color:#232923;font-size:22px;transition:background .2s,color .2s}
.portfolio-video{position:absolute;left:16px;bottom:18px;background:#141b16d9;color:#fff;padding:8px 10px;font-size:10px;letter-spacing:.05em}
@media(hover:hover){a.portfolio-tile:hover .portfolio-image>img{transform:scale(1.035)}a.portfolio-tile:hover .portfolio-open{background:#c64335;color:#fff}}
.portfolio-tile:focus-visible{outline:2px solid #bd4937;outline-offset:6px}
@media(max-width:700px){.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:clamp(200px,52vw,350px);gap:24px 15px}.portfolio-tile{grid-column:span 1;grid-row:span 1}.portfolio-large{grid-column:span 2;grid-row:span 2}.portfolio-wide{grid-column:span 2}.portfolio-tall{grid-column:span 1;grid-row:span 2}.portfolio-caption{display:block;padding-top:10px}.portfolio-caption h2{font-size:14px}.portfolio-caption>span{display:block;text-align:left;font-size:10px;margin-top:4px}.portfolio-open{width:34px;height:34px;bottom:10px;right:10px;font-size:19px}.portfolio-video{left:10px;bottom:12px;font-size:8px;padding:6px}}
@media(prefers-reduced-motion:reduce){.portfolio-image>img,.portfolio-open{transition:none}}


#werb-site .portfolio-caption{flex:none;color:#242621;opacity:1;visibility:visible}#werb-site .portfolio-caption h2{font-size:18px;line-height:1.4;font-weight:500;letter-spacing:-.02em;margin:0}
@media(max-width:700px){#werb-site .portfolio-caption h2{font-size:15px;line-height:1.4}}