/* Artwork-led portfolio; titles remain visible on touch and keyboard. */
.portfolio-page .site-header{position:relative}
.portfolio-gallery{padding:40px var(--space) 72px;min-height:70vh}
.portfolio-heading{display:flex;align-items:center;gap:36px;padding:18px 0 28px;margin-bottom:10px;border-bottom:1px solid var(--header-line)}
.portfolio-tabs{display:flex;gap:28px}
.portfolio-tabs button{position:relative;background:none;padding:12px 0;min-height:48px;font-size:14px;color:var(--header-text)}
.portfolio-tabs button[aria-selected=true]{color:var(--header-accent)}
.portfolio-tabs button::after{content:"";position:absolute;bottom:3px;left:0;right:0;height:2px;background:var(--header-accent);transform:scaleX(0);transform-origin:left;transition:transform .2s}
.portfolio-tabs button[aria-selected=true]::after,.portfolio-tabs button:hover::after{transform:scaleX(1)}
.portfolio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.portfolio-tile{display:block;position:relative;isolation:isolate;aspect-ratio:4/3;min-width:0;overflow:hidden;background:#222}
.portfolio-tile>img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease,filter .3s ease}
.portfolio-tile::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent 40%,#000b 100%);pointer-events:none}
.portfolio-tile-caption{position:absolute;z-index:2;bottom:0;left:0;right:0;display:flex;justify-content:space-between;align-items:end;gap:20px;padding:28px;color:#fff}
.portfolio-tile-caption h2{font-size:clamp(18px,1.65vw,24px)!important}
.portfolio-tile-caption p{font-size:13px;color:#d5d9df;margin-top:8px}
.portfolio-tile-caption>span{font-size:26px;transition:transform .2s ease}
.portfolio-tile:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
@media(hover:hover){.portfolio-tile:hover>img{transform:scale(1.04);filter:brightness(1.08)}.portfolio-tile:hover .portfolio-tile-caption>span{transform:translate(3px,-3px)}}
@media(min-width:1800px){.portfolio-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.portfolio-gallery{padding:24px 16px 48px}.portfolio-heading{align-items:flex-start;flex-direction:column;gap:12px;padding:10px 8px 18px}.portfolio-grid{grid-template-columns:1fr;gap:10px}.portfolio-tile-caption{padding:22px}.portfolio-tile-caption h2{font-size:18px!important}}
@media(prefers-reduced-motion:reduce){.portfolio-tile>img,.portfolio-tile-caption>span,.portfolio-tabs button::after{transition:none}.portfolio-tile:hover>img,.portfolio-tile:hover .portfolio-tile-caption>span{transform:none}}
