/* Compact portfolio cards: four equal boxes, never full-width source images. */
.portfolio-row{margin-top:44px;min-width:0;scroll-margin-top:112px}
.portfolio-row+.portfolio-row{margin-top:32px}
.portfolio-row-head{display:flex;align-items:center;gap:18px;min-height:30px;margin-bottom:14px}
.portfolio-row-head h3{flex-shrink:0;font:10px/1.5 'SFMono-Regular',Consolas,monospace;font-weight:400;letter-spacing:.13em;text-transform:uppercase;color:#afbeb5}
.portfolio-row-rule{height:1px;flex:1;background:var(--line)}
.portfolio-row-controls{display:flex;gap:6px}
.portfolio-row-controls[hidden]{display:none}
.portfolio-row-controls button{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--surface-border);border-radius:5px;background:var(--panel);font:20px/1 Arial,sans-serif;color:var(--ink)}
.portfolio-row-controls button:disabled{opacity:.3;cursor:default}
.portfolio-row-controls button:hover:not(:disabled){background:#26372c;border-color:#6b8b76}
.portfolio-mini-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;min-width:0;align-items:stretch}
.portfolio-mini-card{display:flex;flex-direction:column;min-width:0;padding:6px;border:1px solid rgba(171,191,180,.13);border-radius:7px;background:linear-gradient(150deg,#1a2420,#111a16);box-shadow:inset 0 1px 0 rgba(231,245,235,.04);transition:border-color .25s}
.portfolio-mini-card:hover{border-color:rgba(171,191,180,.32)}
.portfolio-mini-preview{position:relative;width:100%;aspect-ratio:16/10;overflow:hidden;border-radius:3px;background:#0b120e}
.portfolio-mini-preview img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:100%;object-fit:cover;transition:transform .5s var(--ease)}
.portfolio-mini-card:hover img{transform:scale(1.025)}
.portfolio-mini-copy{display:flex;flex:1;flex-direction:column;padding:12px 7px 8px}
.portfolio-mini-copy h4{font:400 13px/1.45 Space,Arial,sans-serif;letter-spacing:-.02em;color:#e4eae6;margin:0 0 4px;min-height:1.45em}
.portfolio-mini-copy p{font-size:11px;line-height:1.5;color:#8f9e95;margin:0 0 12px}
.portfolio-watch{display:inline-flex;align-self:flex-start;align-items:center;gap:8px;margin-top:auto;padding-block:3px;font:9px/1.4 'SFMono-Regular',Consolas,monospace;text-transform:uppercase;letter-spacing:.1em;color:#a2b4a8;transition:color .25s}
.portfolio-watch:hover{color:#e2f0e5}
.portfolio-preview-empty{display:grid;place-items:center;width:100%;height:100%;background:radial-gradient(ellipse at 50% 100%,#243d2e,#101b14 80%);color:#95a99b;font:400 27px/1 Space,Arial,sans-serif;letter-spacing:-.04em}
@media(max-width:900px){.portfolio-mini-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc((100% - 28px)/3);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:1px;padding:1px 1px 8px;scrollbar-width:thin;scrollbar-color:#354b3d transparent}.portfolio-mini-card{scroll-snap-align:start}}
@media(max-width:620px){.portfolio-row{margin-top:32px}.portfolio-row-head{gap:10px}.portfolio-row-head h3{font-size:9px;letter-spacing:.06em}.portfolio-mini-grid{grid-auto-columns:clamp(210px,70vw,265px);gap:12px}.portfolio-mini-copy h4{font-size:13px}}
@media(prefers-reduced-motion:reduce){.portfolio-mini-card,.portfolio-mini-preview img,.portfolio-watch{transition:none}.portfolio-mini-card:hover img{transform:none}}
